JSON.parse() vs JSON.stringify(): What’s the Difference?

JSON.parse() and JSON.stringify() are opposite operations. Parse reads text; stringify writes text. If you remember which side starts with a string, the names stop being confusing: JSON.parse('{"ready":true}') returns an object, while JSON.stringify({ ready: true }) returns the string '{"ready":true}'.

That simple rule covers most uses, but JavaScript values and JSON values are not identical. The differences explain the mysterious missing fields, changed dates, and runtime errors developers encounter during a round trip.

JSON.parse converts JSON text to a value

JSON.parse(text) checks that the entire string follows JSON syntax, then creates the matching JavaScript object, array, string, number, boolean, or null value.

const text = '{"name":"Ada","active":true,"roles":["admin"]}';
const user = JSON.parse(text);
console.log(user.name); // Ada

Use it when reading a JSON string from localStorage, a file, a message queue, or a raw HTTP response. Modern response.json() already parses the response for you, so calling JSON.parse() on its result is a double parse and usually fails with an unexpected-token error.

Parsing is strict. Property names and string values need double quotes; trailing commas, comments, single-quoted strings, undefined, and NaN are invalid. Check a questionable payload with the JSON validator, or follow the step-by-step guide to fix invalid JSON.

JSON.stringify converts a value to JSON text

JSON.stringify(value) walks a JavaScript value and returns its JSON representation. This is what you use before putting structured data into string-only storage or an HTTP request body.

const user = { name: 'Ada', active: true };
const text = JSON.stringify(user);
// {"name":"Ada","active":true}

For readable output, provide indentation as the third argument: JSON.stringify(user, null, 2). The JSON formatter does the same job interactively and makes deeply nested output easier to inspect.

The round trip in practice

A normal browser storage round trip looks like this:

localStorage.setItem('settings', JSON.stringify(settings));
const settings = JSON.parse(localStorage.getItem('settings') ?? '{}');

For an API request, stringify the body and declare its media type:

await fetch('/api/users', {
  method: 'POST',
  headers: { 'Content-Type': 'application/json' },
  body: JSON.stringify(user),
});

The Content-Type header describes the bytes being sent; stringify creates those bytes as text. They solve separate parts of the request.

Values that do not survive stringify

JSON supports objects, arrays, strings, finite numbers, booleans, and null. JavaScript supports more, so a round trip can be lossy:

• Object properties containing undefined, functions, or symbols are omitted.
• Those values become null in arrays.
• NaN, Infinity, and -Infinity become null.
• A Date becomes an ISO 8601 string.
• Map and Set normally become empty objects unless converted first.
• BigInt and circular references throw a TypeError.

This is why JSON.parse(JSON.stringify(value)) is not a universal deep-clone technique. Use structuredClone() for supported in-memory JavaScript types, and use JSON only when you intentionally want JSON's portable data model.

Replacer and reviver functions

The second argument to stringify is a replacer. It can filter properties or transform values before serialization. The second argument to parse is a reviver. It can transform values while rebuilding the result.

const text = JSON.stringify(user, (key, value) =>
  key === 'password' ? undefined : value
);

const data = JSON.parse(text, (key, value) =>
  key === 'createdAt' ? new Date(value) : value
);

A replacer is useful for shaping output, but it is not a substitute for a deliberate API allowlist. A reviver should only convert fields whose schema you control; converting every date-shaped string can mutate ordinary user text.

Escaping is a different operation

Stringify serializes a complete value. Escaping only makes special characters safe inside a JSON string. If you need to embed a quote, newline, or backslash in an existing string, use the JSON escape tool; to turn escape sequences back into characters, use JSON unescape. Do not repeatedly stringify a value to escape it—double encoding creates strings full of backslashes.

The rule to remember

Use JSON.stringify() when a JavaScript value must leave memory as JSON text. Use JSON.parse() when valid JSON text arrives and must become a usable value. Validate at the boundary, account for types JSON cannot represent, and inspect the final structure with the JSON viewer when a round trip behaves unexpectedly.