Data Structure
Networking
RDBMS
Operating System
Java
MS Excel
iOS
HTML
CSS
Android
Python
C Programming
C++
C#
MongoDB
MySQL
Javascript
PHP
Physics
Chemistry
Biology
Mathematics
English
Economics
Psychology
Social Studies
Fashion Studies
Legal Studies
- Selected Reading
- UPSC IAS Exams Notes
- Developer's Best Practices
- Questions and Answers
- Effective Resume Writing
- HR Interview Questions
- Computer Glossary
- Who is Who
How to convert JSON string to array of JSON objects using JavaScript?
JSON is used to exchange data from client to server. JSON is so lightweight and it is easy to read for a human and also easy for a machine to parse and generate. Many times we get data in string format and we need to convert that data into an array. In this article, we will talk about multiple ways to convert JSON string to array of JSON objects using JavaScript.
Using JSON.parse( ) method
Using eval( ) function
Appraoch 1: Using JSON.parse( ) Method
The JSON.parse method is used to Convert JSON strings to a JSON objects. This is a very fast and standard way to deal with JSON data. The JSON.parse takes String as an input and returns the Javascript value, object, array, Boolean, null, etc depending upon the structure of the input value.
Example
In this example, we have a JSON string containing the data of various persons and we are going to convert the JSON string into a JSON object using the JSON.parse method.
<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>
Approach 2: Using eval( ) Function
The eval( ) function in javascript is a global function that is used to evaluate a string as an expression. To convert the JSON string to array of JSON objects using the eval function we pass the JSON string into it and the function returns the JSON object.
Example
In this example, we have a JSON string containing the data of various people and we are going to convert the JSON string into a JSON object using the eval( ) function.
<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>
8K+ Views
