All TalkersCode Topics

Follow TalkersCode On Social Media - A Social Media Network for developers Join Now ➔

Parse JSON In JavaScript

Last Updated : Mar 12, 2024

Parse JSON In JavaScript

In this article we will show you the solution of parse Json in JavaScript, JSON.parse() is the JavaScript method for parsing JSON. When you parse a JSON string in JavaScript, you may look at the string version of a JSON object to create a JavaScript object.

JSON.parse(): It is a JavaScript function that parses a JSON string and creates the JavaScript value or object suggested by the string.

It takes a JSON string as an input and returns a JavaScript object with the JSON contents.

We may stringify the JSON after processing it with the JSON.stringify() function.

JSON.stringify(): It is simpler to send data between a server and a web application by using JSON.stringify() to transform a JavaScript object or value into a JSON string.

Step By Step Guide On Parse Json In Javascript :-

<!DOCTYPE html>
<html lang="en">
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title> parse json in javascript </title>
    <link rel="stylesheet" href="">
            background-color: aliceblue;
            font-family: Cambria, Cochin, Georgia, Times, 'Times New Roman', serif;
          color : rgb(95, 194, 95) ;
          font-size: 25px;
          font-weight : bolder ;
            color : rgb(95, 194, 95) ;
            font-size: 20px;
        <h1> TALKERSCODE </h1>
        <h3> parse json in JavaScript </h3>
      const JSONdata = '{ "name" : "peter", "color" : "yellow", "age" : "20", "city" : "london", "gender" : "male"}' ;
      //parsing the JSON data using JSON,.parse()
      JSONdata = JSON.parse(JSONdata) ;
        console.log( ;
        console.log("<br>") ;
        console.log(JSONdata.age) ;
        console.log("<br>") ;
        console.log( ;
        console.log("<br>") ;
        console.log(JSONdata.color) ;
        console.log("<br>") ;
        console.log(JSONdata.gender) ;
        console.log("<br>") ;
    //strigify the JSON data using JSON.stringify()
    JSONdata = JSON.stringify(JSONdata) ;
    console.log(JSONdata) ;
  1. Specifying the HTML version of a file is done by writing <!DOCTYPE html> in the HTML code.
  2. The <HTML> tag, indicating the root of an HTML document, should be included and closed with the </html> tag at the end.
  3. Metadata for the HTML file is contained within the <head> tag, which is terminated with the </head> tag.
  4. The HTML document's title is defined using the <title> tag, followed by the </title> tag.
  5. Styling for the HTML page will be achieved by utilizing an external CSS file.
  6. CSS can be added using the <style> tag.
  7. JavaScript can be written within the <script> tag, and it should be closed with the </script> tag.
  8. Create a JSON object named JSONdata using const
  9. Now using JSON.parse() to parse the JSON data.
  10. Using console.log() to obtain the JSON data and also write HTML tag <br> to add space
  11. If we want to stringify again, use JSON.stringify().
  12. Again use console.log() to get the whole JSON value.

Conclusion :-

At last, in conclusion, we can say that with this article’s help, we know parse JSON using JavaScript.

I hope this article on parse Json in JavaScript helps you and the steps and method mentioned above are easy to follow and implement.

Author Image About Riya

A recent graduate with a Bachelor of Technology (B.Tech) in Computer Science from India. She is passionate about leveraging technology to solve real-world problems. With a strong foundation and experience in programming languages such as Python, Django, HTML, CSS, and JavaScript, java, php and have honed her skills through hands-on projects and coursework.

Follow Riya On Linkedin 🡪