Difference between JSON.stringify() and JSON.parse()
Difference between JSON.stringify()
and JSON.parse()
Function | What it does | Input | Output | When to use |
---|---|---|---|---|
JSON.stringify() | Converts a JavaScript object/array into a JSON string | Object / Array | String | When sending data to a server or storing it (like in localStorage) |
JSON.parse() | Converts a JSON string back into a JavaScript object/array | String | Object / Array | When receiving JSON data from a server or reading stored data |
📘 Example
<!DOCTYPE html>
<html>
<head>
<title>JSON Example</title>
</head>
<body>
<script>
// Example Student Object
var student = {
name: "Sanjay",
age: 23,
className: "10A",
location: "Delhi"
};
console.log("Original Object:", student);
// 1️⃣ Convert object to JSON string (stringify)
var jsonString = JSON.stringify(student);
console.log("After JSON.stringify():", jsonString);
// Output: {"name":"Sanjay","age":23,"className":"10A","location":"Delhi"}
// 2️⃣ Convert JSON string back to object (parse)
var jsonObject = JSON.parse(jsonString);
console.log("After JSON.parse():", jsonObject);
// Output: {name: 'Sanjay', age: 23, className: '10A', location: 'Delhi'}
// ✅ Accessing property after parse
console.log("Student Name:", jsonObject.name);
</script>
</body>
</html>
🔎 Explanation Step by Step:
We start with a JavaScript object →
{name: "Sanjay", age: 23, ...}
JSON.stringify(student)
converts it to a JSON string:👉 This is just text — useful for sending across network or storing in DB/localStorage.
JSON.parse(jsonString)
converts the string back to an object so we can use it again in code.
⚡ In simple words:
stringify()
→ Object → String (for transport/storage)parse()
→ String → Object (for use in JS code)
Comments
Post a Comment