How to convert a JSON string to an array of JSON objects using JavaScript?-JS Tutorial-php.cn

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

WBOY

Release： 2023-08-27 17:33:02

forward

1565 people have browsed it

如何使用 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>

Copy after login

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>

Copy after login

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!