Home  >  Article  >  Web Front-end  >  How to convert a JSON string to an array of JSON objects using JavaScript?

How to convert a JSON string to an array of JSON objects using JavaScript?

WBOY
WBOYforward
2023-08-27 17:33:021541browse

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

JSON is used to exchange data from client to server. JSON is very lightweight, easy for humans to read, and easy for machines to parse and generate. Many times when we get data in string format, we need to convert the data into an array. In this article, we will discuss various ways to convert a JSON string into an array of JSON objects using JavaScript.

  • Use JSON.parse() method

  • Use eval() function

Method 1: Use JSON.parse() method

The JSON.parse method is used to convert JSON strings into JSON objects. This is a very fast and standard way of working with JSON data. JSON.parse takes a String as input and returns a Javascript value, object, array, boolean, null, etc. depending on the structure of the input value.

Example

In this example, we have a JSON string containing data for various people, and we will use the JSON.parse method to convert this JSON string into a JSON object.

<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>

Method 2: Use the eval() function

The eval( ) function in JavaScript is a global function used to evaluate a string as an expression. To convert a JSON string to an array of JSON objects using the eval function, we pass it a JSON string and the function returns a JSON object.

Example

In this example, we have a JSON string containing data for different people, we will use the eval() function to convert this JSON string into a JSON object.

<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>

The above is the detailed content of How to convert a JSON string to an array of JSON objects using JavaScript?. For more information, please follow other related articles on the PHP Chinese website!

Statement:
This article is reproduced at:tutorialspoint.com. If there is any infringement, please contact admin@php.cn delete