What is JSON?

JSON (JavaScript Object Notation) is a lightweight text-based format for storing and exchanging data. It is easy to read, write, and widely used for communication between a server and a client.

• JSON stores data in key-value pairs.
• It is language-independent but derived from JavaScript syntax.
• JSON data is written in a human-readable format.
• It supports objects { } and arrays [ ] for data representation.

JSON Example

{
    "name": "Shubham Verma",
    "age": 22,
    "city": "Haryana"
}

Here,

• name is a string.
• age is a number.
• city is a string.

Parsing JSON data in JavaScript and accessing its values

const jsonStr = '{"name": "Mohit", "age": 30, "city": "New Delhi"}';

// Convert JSON string into JavaScript object
const obj = JSON.parse(jsonStr);

// Accessing JSON data
console.log(obj.name);
console.log(obj.age); 
console.log(obj.city); 

Mohit
30
New Delhi

• JSON.parse() is used to convert the JSON string into a JavaScript object.
• The object’s properties (name, age, city) are accessed just like any other JavaScript object.

How Does JSON Work?

JSON is commonly used to transfer data between a server and a web application. Here's a simple process:

• The server sends data as a JSON string.
• The client receives the JSON string and converts it into a native object for use in the application.

JSON Array with Objects

const jsonArr = 
      '[{"name": "Amit", "age": 30}, {"name": "Mohit", "age": 25}, {"name": "Rohit", "age": 35}]';

// Parse JSON array into JavaScript object
const obj = JSON.parse(jsonArr);

// Accessing array elements
console.log(obj[0].name);
console.log(obj[1].age);  
console.log(obj[2].name); 

Amit
25
Rohit

• JSON arrays are converted to JavaScript arrays using JSON.parse().
• Access array items using index, e.g., people[0].name.

JavaScript Object to JSON String

Converts a JavaScript object into a JSON string using JSON.stringify().

const obj = {
    name: "Mohit",
    age: 30,
    city: "New Delhi"
};

// Convert JavaScript object to JSON string
const jsonStr = JSON.stringify(obj);

console.log(jsonStr);

{"name":"Mohit","age":30,"city":"New Delhi"}

• JSON.stringify() converts a JavaScript object into a JSON-formatted string.
• Useful for sending data to servers or storing it as text.

Nested JSON Data

const nJSON = `{
    "a": [
        {"fName": "Amit", "lName": "Kumar"},
        {"fName": "Sumit", "lName": "Dev"},
        {"fName": "Punit", "lName": "Singh"}
    ]
}`;

// Parse nested JSON string
const obj = JSON.parse(nJSON);

// Access nested data
console.log(obj.a[0].fName);
console.log(obj.a[1].lName); 
console.log(obj.a[2].fName);

Amit
Dev
Punit

• JSON can contain objects and arrays nested within each other.
• Use array indexing and dot notation to access nested data.

Applications of JSON

• Web APIs: JSON is commonly used to fetch data from RESTful APIs.
• Configuration Files: Many tools and applications use JSON for storing configuration settings.
• Data Storage: JSON is used in NoSQL databases like MongoDB.
• Cross-Language Communication: JSON provides data exchange between different programming environments.

Advantages of JSON

• Human-Readable: Easy for developers to read and debug.
• Compact: Uses a simple structure, reducing data size.
• Fast Parsing: Native support in many languages makes parsing quick.
• Standard Format: Universally accepted for data exchange.