JSON Beautifier
Developer workflows3 min read

JSON.parse vs JSON.stringify: Objects, Strings, and Double Encoding

Parsing turns JSON text into a JavaScript value. Stringifying turns a JavaScript value into JSON text. Follow a value across both directions to avoid accidentally encoding a document twice.

Try JSON stringify

Follow the direction of the conversion

JSON is text. A JavaScript object is a value in memory. They can look similar in a console, but you use different operations on them. JSON.parse reads a JSON string and returns its value; JSON.stringify serializes a JavaScript value into a string.

The example below starts with a document received as text. After parsing, user.name is a normal JavaScript property. After serialization, encoded is text again and can be sent or stored at a boundary that expects JSON.

One parse, one serialization
const raw = '{"name":"Alice","active":true}';
const user = JSON.parse(raw);
console.log(user.name); // Alice

const encoded = JSON.stringify(user);
console.log(typeof user);    // object
console.log(typeof encoded); // string

Recognize double encoding

If you stringify text that already contains a JSON document, you get a JSON string value containing that document. The inner quotes need escaping. That is appropriate only when the receiving contract explicitly expects JSON text inside a string field.

If an API expects an object, send a serialization of the object once. If the API has a field such as payloadText that deliberately contains a document as text, an escaped string is expected. Check the contract rather than removing backslashes until the output looks attractive.

A deliberate extra encoding layer
const document = '{"name":"Alice"}';
const wrapped = JSON.stringify(document);
// wrapped: "{\"name\":\"Alice\"}"

const recoveredText = JSON.parse(wrapped);
const recoveredValue = JSON.parse(recoveredText);

Choose the right browser tool

Use the formatter to make an existing document readable. Use the minifier to remove insignificant whitespace. Use Escape / Unescape to encode or decode an ordinary text string. Use the JSON Stringify tool when you want a quoted string containing a compact JSON document.

The tools solve different tasks. Decoding a JSON string returns text; parsing that returned text as a document is a second operation. Do not assume that any successfully decoded string contains a valid object or array.

Handle unsupported JavaScript values

JSON has fewer value types than JavaScript. Functions, undefined, symbols and BigInt do not have ordinary JSON representations. Serialization rules depend on where a value appears, and some values cause an error. Choose explicit conversions rather than relying on accidental omissions.

A Date is commonly serialized as text, which means parsing alone will not turn it back into a Date object. If a schema says a field is a timestamp, interpret it at a deliberate point in your application.

Debug at the boundary

When a parser fails, inspect the actual string being parsed. Logging typeof value before the operation can distinguish an object from document text. An empty response, HTML error body, or truncated string is a different problem from double encoding.

For reproducible comparisons, validate both documents and compare their structure. Whitespace and object key order should not matter when you are checking values, but array order often does.

  • Do not call JSON.parse on an object you already parsed.
  • Do not stringify a response body twice unless its contract calls for a string containing JSON.
  • Use a small sample to establish the expected types at each step.
  • Use an error guide when the actual input is empty or incomplete.

Put the example to work

Use your own sample, check the result, and copy or download it. The tool processes your data locally in your browser.

Try JSON stringify