References

Beginner-friendly references for web development, with live, editable examples.

The JavaScript JSON object

Object JavaScript All modern browsers Updated
Quick answer

The JSON object is a built-in namespace with two key methods: JSON.stringify() turns a JavaScript value into a JSON string, and JSON.parse() turns a JSON string back into a value. You use them to send data to a server, store it in localStorage, or read an API response.

Overview

JSON (JavaScript Object Notation) is the standard text format for exchanging data, and the JSON object is the built-in tool for converting to and from it. Like Math, it's a static namespace, not a constructor — you just call its two methods.

JSON.stringify() serializes a value out to a JSON string, for sending in a fetch() request body or saving in localStorage (which stores only strings). Pass a third argument to pretty-print: JSON.stringify(obj, null, 2). JSON.parse() reads a JSON string back in to a usable object. Together they round-trip data through any text channel.

Two things to keep in mind. JSON.parse() throws a SyntaxError on invalid JSON, so wrap it in try...catch. And JSON can only represent a subset of JavaScript: undefined, functions and symbols are dropped by stringify(), and dates become strings (you get them back as strings, not Date objects). JSON keys and string values must use double quotes — single quotes are invalid JSON.

Syntax

const json = JSON.stringify(value);       // value -> string
const value = JSON.parse(json);           // string -> value

JSON.stringify({ a: 1 });                 // '{"a":1}'
JSON.stringify(obj, null, 2);             // pretty-printed
JSON.parse('{"a":1}');                    // { a: 1 }

Example

Live example 
<pre id="out" style="font:14px ui-monospace,monospace"></pre>
<script>
  const data = { user: 'Ada', roles: ['admin', 'editor'] };

  const text = JSON.stringify(data);        // out to a string
  const back = JSON.parse(text);            // back to an object

  document.getElementById('out').textContent =
    'string: ' + text + '\n' +
    'roles:  ' + back.roles.join(', ');
</script>

Best practices

  • Wrap JSON.parse() in try...catch — invalid JSON throws.
  • Pretty-print for humans with JSON.stringify(value, null, 2).
  • Remember undefined, functions and dates don't survive a JSON round-trip intact.
  • Use double quotes in JSON — single quotes and trailing commas are invalid.

Frequently asked questions

What is the JSON object in JavaScript?
A built-in namespace with stringify() and parse() for converting between JavaScript values and JSON text.
How do I convert an object to a JSON string?
Use JSON.stringify(obj). Add null, 2 as extra arguments to pretty-print.
How do I parse a JSON string?
Use JSON.parse(text), and wrap it in try...catch in case the text is invalid.
Why did my dates turn into strings?
JSON has no date type, so stringify() converts dates to ISO strings. Convert them back to Date objects yourself after parsing.
Intl.NumberFormat localStorage