Open In App

JavaScript JSON Parser

Last Updated : 06 Sep, 2023
Improve
Improve
Like Article
Like
Save
Share
Report

JSON (JavaScript Object Notation) is a popular lightweight data exchange format for sending data between a server and a client, or across various systems.

JSON data is parsed and interpreted using a software component or library called a JSON parser. Through the JSON parsing process, a JSON string is converted into a structured format that is easy to modify and access programmatically. Developers may deal with JSON data in a systematic and effective way thanks to the availability of JSON parsers in a variety of programming languages and frameworks.

JSON can be in the following two structures:

  • Arrays i.e. Ordered list of items /values
  • Objects i.e. Collection of key-value pairs

JSON parser reads and writes the formatted JSON data. It is used for mapping the JSON Object entries or attributes and the JavaScript objects, array, string, boolean, Number, etc. It can be performed in two types:

  • Mapping JSON types to Entries or Attributes
  • Mapping Entries or Attributes to JSON types

Mapping JSON types to Entries or Attributes: JSON types are mapped in a way that the entries are the value and the attributes as the properties having that value. So the structures data remain the same and it is converted to the JavaScript objects

Mapping Entries or Attributes to JSON types: These Entries and attributes to JSON objects are converted as the Attribute are the object properties and entries are the property Values maintaining the structure of the data from one type to another.

JSON data when converted is the reciprocal i.e. It can be reformed back as the original data and object from the converted state. THe data remains the same only the representation or outer form is changed. Hence no data is lost and is used efficiently.

Importance of using JSON Parsing

  • Developers can transform JSON data into usable objects or data structures in their preferred programming language by using JSON parsing.
  • For managing APIs, obtaining data from databases, and processing data obtained from online services, JSON parsing is essential.
  • Developers may extract and use the necessary data by accessing particular data pieces inside a JSON structure thanks to JSON parsing.

JSON Parsing Methods

  • Using JSON.parse() method
  • fetch data from APIs or local JSON files

Method 1: Using JSON.parse() Method

JSON.parse() is a function included in JavaScript supports JSON parsing. It transforms JSON text into a JavaScript object so that its attributes may be easily accessed.

Syntax:

JSON.parse(jsonString);

Parameters: It takes JavaScript String as a parameter to parse.

Uses:

  • JSON.parse(): This method analyzes a JavaScript String and outputs an object to make its attributes accessible.

Example: The code example shows how to implement a JSON parser with JavaScript using JSON.parse():

Javascript




// Creating a JavaScript object
const jsonString = 
    '{"name": "Geek", "age": 22, "city": "Delhi"}';
  
// Creting JSON object 
const obj = JSON.parse(jsonString);
console.log(obj.name);  // Output: Geek
console.log(obj.age);     // Output: 22
console.log(obj.city);     // Output: Delhi


Output:

Geek
22
Delhi

Method 2: Fetching Data from Local File

In this method, we wiil import local json file and output the data on console using JavaScript require method.

// data.json file
{
"data": [
{
"name": "GFG",
"description" : "A Computer Science portal!"
}
]
}

Example: In this method, we will use require method to import the local data.json file and display output.

Javascript




const sample = require('./data.json');
console.log(sample.data[0]);


Javascript




// data.json file
{
    "data": [
        {
            "name": "GFG",
            "description" : "A Computer Science portal!"
        }
    ]
}


Output:

{ name: 'GFG', description: 'A Computer Science portal!' }

There are more method to read the json files that you can find here https://www.geeksforgeeks.org/read-json-file-using-javascript/



Like Article
Suggest improvement
Previous
Next
Share your thoughts in the comments

Similar Reads