JSON (JavaScript Object Notation) is a lightweight format for storing and exchanging data. JavaScript provides JSON.parse() and JSON.stringify() to work with JSON data efficiently.

This blog explains JSON, how to convert it to objects, and vice versa.

⭐ 1. What Is JSON?

JSON is a text-based format for representing structured data. It is commonly used to exchange data between client and server.

Example of JSON:

{
  "name": "Sagar",
  "age": 22,
  "city": "Ludhiana"
}

⭐ 2. Converting JSON to JavaScript Object

Use JSON.parse() to convert a JSON string into a JavaScript object.

let jsonData = '{"name":"Sagar","age":22,"city":"Ludhiana"}';
let user = JSON.parse(jsonData);
console.log(user.name); // Sagar
console.log(user.age);  // 22

⭐ 3. Converting JavaScript Object to JSON

Use JSON.stringify() to convert a JavaScript object into a JSON string.

let user = {
  name: "Sagar",
  age: 22,
  city: "Ludhiana"
};

let jsonData = JSON.stringify(user);
console.log(jsonData);
// Output: {"name":"Sagar","age":22,"city":"Ludhiana"}

⭐ 4. Working With Arrays in JSON

Array Example

let fruits = ["Apple", "Banana", "Mango"];
let jsonFruits = JSON.stringify(fruits);
console.log(jsonFruits); // ["Apple","Banana","Mango"]

let arr = JSON.parse(jsonFruits);
console.log(arr[1]); // Banana

⭐ 5. Why JSON Is Important

Easy to read and write for humans
Lightweight and fast for data transfer
Language-independent format
Works seamlessly with JavaScript and APIs

⭐ 6. Common Use Case: Fetching Data from APIs

fetch("https://api.example.com/users")
  .then(response => response.json())  // parse JSON
  .then(data => console.log(data))
  .catch(error => console.log(error));

⭐ Conclusion

JSON is an essential part of modern web development. Using JSON.parse() and JSON.stringify(), you can easily exchange and manipulate data between the client and server, enabling dynamic and responsive applications.

📌 Citations

🔗 View other articles about Javascript:
https://savanka.com/category/learn/js/

🔗 External Javascript Documentation:
https://www.w3schools.com/js/

JavaScript JSON Explained With Parse And Stringify