
- Javascript Basics Tutorial
- Javascript - Home
- Javascript - Overview
- Javascript - Syntax
- Javascript - Enabling
- Javascript - Placement
- Javascript - Variables
- Javascript - Operators
- Javascript - If...Else
- Javascript - Switch Case
- Javascript - While Loop
- Javascript - For Loop
- Javascript - For...in
- Javascript - Loop Control
- Javascript - Functions
- Javascript - Events
- Javascript - Cookies
- Javascript - Page Redirect
- Javascript - Dialog Boxes
- Javascript - Void Keyword
- Javascript - Page Printing
- JavaScript Objects
- Javascript - Objects
- Javascript - Number
- Javascript - Boolean
- Javascript - Strings
- Javascript - Arrays
- Javascript - Date
- Javascript - Math
- Javascript - RegExp
- Javascript - HTML DOM
- JavaScript Advanced
- Javascript - Error Handling
- Javascript - Validations
- Javascript - Animation
- Javascript - Multimedia
- Javascript - Debugging
- Javascript - Image Map
- Javascript - Browsers
- JavaScript Useful Resources
- Javascript - Questions And Answers
- Javascript - Quick Guide
- Javascript - Functions
- Javascript - Resources
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.
- Related Articles
- How to convert JSON data into a Python object?
- How to deserialize a JSON into Javascript object?
- How to convert a date object's content into json in JavaScript?
- How can we convert a JSON string to a JSON object in Java?
- Strip quotes with JavaScript to convert into JSON object?
- How to transform JSON text into a JavaScript object?
- How to convert JSON text to JavaScript JSON object?
- How to turn a JSON object into a JavaScript array in JavaScript ?
- How to convert JSON results into a date using JavaScript?
- How to convert JSON string into Lua table?
- How to convert a string to JavaScript object?
- How to convert a JavaScript date object to a string?
- How to convert a string into integer in JavaScript?
- Python - Ways to convert string to json object
- How to convert a String into a Date object using JDBC API?
