Closure CavesISSUE #35 of 61

json · parse · stringify · replacer · reviver

LambdaVSThe Mutator

Lambda saysJSON.parse turns a JSON string into JS; JSON.stringify turns JS into a JSON string.

JSON is the data format of the web. JSON.parse(str) builds objects/arrays from text (throws on invalid JSON — wrap in try/catch). JSON.stringify(value, replacer, space) serializes; the third argument pretty-prints with indentation. JSON only covers data — functions, undefined, and dates don't round-trip cleanly.

Power-ups you unlock

JSON.parse(str) → JS value (throws on bad input)
JSON.stringify(val, null, 2) pretty-prints
Functions/undefined are dropped; dates become strings
The lingua franca for APIs and storage

The Mutator attacks — common mistakes

Parsing untrusted input without try/catch
Expecting Date objects to survive a round-trip
Circular references throwing in stringify

Boss battleStringify an object with 2-space indent, then parse it back.

Example code

<!doctype html><html><head><meta charset="utf-8"></head>
<body style="background:#06040d;color:#e6e0ff;font-family:monospace;padding:20px"><pre id="o"></pre>
<script>const obj={a:1,b:[2,3]}; const s=JSON.stringify(obj,null,2); const back=JSON.parse(s);
document.getElementById('o').textContent=s+'\nparsed.b[0]='+back.b[0];</script></body></html>

▶ Open the interactive comic issue

‹ Regex · Lookahead · Lookbehind Errors · Try · Catch · Finally ›