Heim  >  Artikel  >  Web-Frontend  >  Wie konvertiere ich einen JSON-String mit JavaScript in ein Array von JSON-Objekten?

Wie konvertiere ich einen JSON-String mit JavaScript in ein Array von JSON-Objekten?

WBOY
WBOYnach vorne
2023-08-27 17:33:021541Durchsuche

如何使用 JavaScript 将 JSON 字符串转换为 JSON 对象数组?

JSON wird verwendet, um Daten vom Client zum Server auszutauschen. JSON ist sehr leicht, für Menschen leicht lesbar und für Maschinen leicht zu analysieren und zu generieren. Wenn wir Daten im String-Format erhalten, müssen wir die Daten oft in ein Array konvertieren. In diesem Artikel besprechen wir verschiedene Möglichkeiten, einen JSON-String mithilfe von JavaScript in ein Array von JSON-Objekten zu konvertieren.

  • Verwenden Sie die JSON.parse()-Methode

  • Verwenden Sie die Funktion eval( )

Methode 1: Verwenden Sie die JSON.parse()-Methode

Die Methode

JSON.parse wird zum Konvertieren einer JSON-Zeichenfolge in ein JSON-Objekt verwendet. Dies ist eine sehr schnelle und standardmäßige Methode zum Arbeiten mit JSON-Daten. JSON.parse verwendet einen String als Eingabe und gibt abhängig von der Struktur des Eingabewerts einen Javascript-Wert, ein Objekt, ein Array, einen Booleschen Wert, eine Null usw. zurück.

Beispiel

In diesem Beispiel haben wir eine JSON-Zeichenfolge, die Daten für verschiedene Personen enthält, und wir werden die JSON.parse-Methode verwenden, um diese JSON-Zeichenfolge in ein JSON-Objekt zu konvertieren.

<html>
<body>
   <h2>Convert JSON string to array of JSON objects using JSON.parse method</h2>
   <p>Click the following button to convert JSON string to an array of JSON objects</p><br>
   <button id="btn" onclick="convert( )" > Click Here </button> <br>
   <p id="result"> </p>
   <script>
      function convert(){
         
         // Initialize the dummy JSON String
         let jsonString = '[ { "name" : "Ram", "age" : 20, "car" : "ford" },{ "name": "Shyam", "age" : "21", "car" : "tata" }, { "name" : "Mohan", "age" : 22, "car" : "toyota" } ]'
         
         // Conver the JSON String to JSON object
         let jsonObject = JSON.parse(jsonString);
         
         // Get the paragraph element
         let p = document.getElementById("result")
         
         /// Print the Object
         p.innerText += JSON.stringify(jsonObject);
         
         // Print the Object on Console
         console.log(jsonObject)
      }
   </script>
</body>
</html>

Methode 2: Verwenden Sie die Funktion eval( )

Die Funktion eval( ) in JavaScript ist eine globale Funktion, die zum Auswerten einer Zeichenfolge als Ausdruck verwendet wird. Um einen JSON-String mit der Funktion eval in ein Array von JSON-Objekten zu konvertieren, übergeben wir ihm einen JSON-String und die Funktion gibt ein JSON-Objekt zurück.

Beispiel

In diesem Beispiel haben wir eine JSON-Zeichenfolge, die Daten für verschiedene Personen enthält. Wir verwenden die Funktion eval( ), um diese JSON-Zeichenfolge in ein JSON-Objekt umzuwandeln.

<html>
<body>
   <h2>Convert JSON string to array of JSON objects using eval function</h2>
   <p>Click the following button to convert JSON string to an array of JSON objects</p><br>
   <button id="btn" onclick="convert( )" > Click Here </button> <br>
   <p id="result"></p>
   <script>
      function convert(){
         
         // Initialize the dummy JSON String
         let jsonString = '[ { "name" : "Ram", "age" : 20, "car" : "ford"},{ "name": "Shyam", "age" : "21", "car" : "tata" }, { "name" : "Mohan", "age" : 22, "car" : "toyota" } ]'
         
         // Conver the JSON String to JSON object
         let jsonObject = eval(jsonString);
         
         // Get the paragraph element
         let p = document.getElementById("result")
         
         /// Print the Object
         p.innerText += JSON.stringify(jsonObject);
         
         // Print the Object on Console
         console.log(jsonObject)
      }
   </script>
</body>
</html>

Das obige ist der detaillierte Inhalt vonWie konvertiere ich einen JSON-String mit JavaScript in ein Array von JSON-Objekten?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Dieser Artikel ist reproduziert unter:tutorialspoint.com. Bei Verstößen wenden Sie sich bitte an admin@php.cn löschen