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 a JSON string into a JavaScript object?
In this article we are going to discuss how to convert a JSON string into a JavaScript object with suitables examples in JavaScript.
There are two possible ways to convert a JSON string into a Javascript object – eval() and parse(). The usage of eval() method is unsafe and not preferred. It is vulnerabable to hackers. The parse() method is preferred in general anytime.
The typical application for JSON is Data transfer to and from a web server. The data that has been sent from a server is always a JSON string. Using JSON.parse(), we can convert the JSON string into a JS object.
Syntax
The syntax on how to convert a JSON string into JS object is −
JSON.parse(text);
Where, text is the string whose value is to be converted into an object.
Example 1
In this example, we use parse() method to convert a JSON string to object. The dictionary is taken as a JSON string.
HTML as a JSON
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>To convert a JSON string into a JS object</title>
</head>
<body>
<p id="parse"></p>
<script>
var json = '{"name":"Rajesh","company": "Tutorials point","job_location":"Hyderabad"}';
var object = JSON.parse(json);
document.getElementById('parse').innerHTML='object.name = '+object.name+'<br/>'+'object.company = '+object.company+'<br/>'+'object.job_location = '+object.job_location;
</script>
</body>
</html>
On executing the above code, the following output is generated.
Example 2
In this example, we use parse() method to convert a JSON string to object. The dictionary is taken as a JSON string.
Array as a JSON
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>To convert a JSON string into a JS object</title>
</head>
<body>
<p id="parse"></p>
<script>
var json = '["iPhone","Samsung","One plus"]';
var arr_object = JSON.parse(json);
document.getElementById('parse').innerHTML='arr_object[0] = '+arr_object[0]+'<br/>'+'arr_object[2] = '+arr_object[2];
</script>
</body>
</html>
On executing the above code, the following output is generated.
Example 3
The below example program illustrates about converting a JSON string into JS object where the date is given as a string in JSON string. Because JSON string does not accept Date objects.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>To convert a JSON string into a JS object when date is given as a string</title>
</head>
<body>
<h3>convert a JSON string( where date is included as a string) into a JS object </h3>
<p id="parse"></p>
<script>
//You cannot take a date object directly in a JSON String. Use it is as a string in JSON string.
const person = '{"name":"Ram", "dob":"01-01-1995", "aadhar-id":"7365 0000 1111"}';
const object = JSON.parse(person);
object.dob = new Date(object.dob);
document.getElementById('parse').innerHTML = 'object.name = ' + object.name + '<br/>' + 'object.dob = ' +object.dob;
</script>
</body>
On executing the above code, the following output is generated.
3K+ Views
To Continue Learning Please Login