What is JSON?
JSON (JavaScript Object Notation) is a lightweight data format for exchanging data.
It supports strings, numbers, booleans, null, arrays, and objects.
JSON is language-agnostic and widely used in APIs and configuration files.
JavaScript Tutorial
Working with JSON in JavaScript
JSON is the standard format for data exchange on the web.
Learn how to parse, stringify, and validate JSON safely.
Why We Need It
Most APIs send JSON, so you must parse and validate data correctly.
Understanding JSON prevents runtime errors and data loss.
Syntax
JSON.parse(jsonString);
JSON.stringify(value);Basic Example
1. Basic JSON.parse
const json = '{"name":"Asha","age":21}';
const user = JSON.parse(json);
console.log(user.name);JSON.parse converts a JSON string into an object.
Real World Example
2. Safe Parsing with try/catch
function safeParse(str) {
try {
return JSON.parse(str);
} catch {
return null;
}
}
console.log(safeParse('{"ok":true}'));
console.log(safeParse('invalid'));Use try/catch to avoid crashes on invalid JSON.
Multiple Use Cases
Parsing JSON Safely
Use JSON.parse() to convert a JSON string into a JavaScript value.
Wrap parsing in try/catch to handle invalid JSON.
Validate shape after parsing to avoid runtime errors.
Stringifying JavaScript Values
Use JSON.stringify() to convert JavaScript values into JSON strings.
Functions, undefined, and symbols are not serialized.
Use replacer and spacing options for custom output.
Common Pitfalls
Dates become strings when stringified and lose timezone behavior.
Circular references throw errors during JSON.stringify().
Precision can be lost with large numbers; consider BigInt or strings.
More Examples
3. JSON.stringify Basics
const user = { name: "Asha", age: 21 };
const json = JSON.stringify(user);
console.log(json);JSON.stringify converts objects into JSON strings.
4. Custom Replacer and Spacing
const user = { name: "Asha", password: "secret" };
const json = JSON.stringify(user, (key, value) => (key === "password" ? undefined : value), 2);
console.log(json);Use a replacer to remove fields and spacing for readability.
Comparison
Without
// Risky parse
const data = JSON.parse(input);With
// Safe parse
const data = (() => {
try { return JSON.parse(input); } catch { return null; }
})();Common Mistakes and Fixes
Assuming JSON supports functions
Functions are skipped by JSON.stringify.
Ignoring parse errors
Wrap JSON.parse in try/catch and handle failures.
Serializing circular data
Remove cycles or use a custom serializer.
Interview Questions
What does JSON.parse do?
It converts a JSON string into a JavaScript value.
What cannot be serialized by JSON.stringify?
Functions, undefined, and symbols.
How do you handle invalid JSON?
Use try/catch and return a fallback.
Practice Problem
Practice: Parse a JSON string and log a field.
const json = '{"name":"Riya","age":20}';
// TODO: parse and log name
One Possible Solution
const json = '{"name":"Riya","age":20}';
const user = JSON.parse(json);
console.log(user.name);Frequently Asked Questions
Is JSON the same as JavaScript objects?
No. JSON is a string format with stricter rules.
Why does JSON.parse throw?
Because the input string is not valid JSON.
Can JSON store dates?
Dates are stored as strings and must be rehydrated.
How to pretty-print JSON?
Use JSON.stringify(value, null, 2).
Try It Yourself
Try parsing a JSON string and reading a property.