How To Parse JSON On JavaScript
Last Updated : Mar 11, 2024
IN - JavaScript | Written & Updated By - Anjali
In this article we will show you the solution of how to parse JSON on JavaScript, to parse JSON on JavaScript, we have to use JSON.parse() method.
When you parse a JSON string in JavaScript, you can examine the string representation of a JSON object in order to turn a JavaScript object.
JSON.parse(): It is a JavaScript built-in function that parses a JSON string and constructs the JavaScript value or object indicated by the string.
It accepts a JSON string as an argument and produces a JavaScript object that corresponds to the JSON contents.
After parsing the JSON, we can also stringify it by using the JSON.stringify() method.
Step By Step Guide On How To Parse JSON On JavaScript :-
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title> how to parse JSON on javascript </title>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/water.css@2/out/water.css">
<style>
body{
background-color: aliceblue;
font-family: Cambria, Cochin, Georgia, Times, 'Times New Roman', serif;
}
h1{
color : rgb(95, 194, 95) ;
font-size: 25px;
font-weight : bolder ;
}
h3{
color : rgb(95, 194, 95) ;
font-size: 20px;
}
</style>
</head>
<body>
<center>
<h1> TALKERSCODE </h1>
<h3> how to parse json on javascript </h3>
</center>
<script>
let person = '{"name": "thomas", "age":"23", "city":"paris", "id" : "1", "color": "black"}' ;
//parse()
person = JSON.parse(person) ;
document.write(person.name) ;
document.write("<br>") ;
document.write(person.age) ;
document.write("<br>") ;
document.write(person.city) ;
document.write("<br>") ;
document.write(person.id) ;
document.write("<br>") ;
document.write(person.color) ;
document.write("<br>") ;
//stringify()
person = JSON.stringify(person) ;
document.write(person) ;
document.write("<br>") ;
</script>
</body>
</html>
- Specifying the HTML version of a file is done by writing <!DOCTYPE html> in the HTML code.
- The <HTML> tag, indicating the root of an HTML document, should be included and closed with the </html> tag at the end.
- Metadata for the HTML file is contained within the <head> tag, which is terminated with the </head> tag.
- The HTML document's title is defined using the <title> tag, followed by the </title> tag.
- Styling for the HTML page will be achieved by utilizing an external CSS file.
- CSS can be added using the <style> tag.
- JavaScript can be written within the <script> tag, and it should be closed with the </script> tag.
- Create a JSON object using let and adding some key and values.
- Now using JSON.parse() to parse the JSON data.
- Using document.write() to obtain the JSON data and also write HTML tag <br> to add space
- If we want to stringify again, use JSON.stringify().
- Again using document.write() to get the whole JSON value.
Conclusion :-
At last, in conclusion, we can say that with this article’s help, we know how to parse JSON using JavaScript.
I hope this article on how to parse JSON on JavaScript helps you and the steps and method mentioned above are easy to follow and implement.
About Anjali
