JSON Parse

The JSON.parse() Method

The JSON.parse() method converts JSON text into a JavaScript value.

After parsing, the value can be used like any other JavaScript value.

Note: JSON is text JSON.parse() converts JSON text into a JavaScript value.

Syntax

JSON.parse(text, reviver)

Parsing a JSON Object

Convert a JSON text into a JavaScript object.

Example

const text = '{"name":"John","age":30,"city":"New York"}';

const person = JSON.parse(text);

let name= person.name;

Note: After parsing, object properties can be accessed with normal JavaScript syntax.

Parsing a JSON Array

Convert a JSON text into a JavaScript array.

Example

const text = '["Ford","Volvo","BMW"]';

const cars = JSON.parse(text);

let name= cars[0];

Note: After parsing, you can use normal JavaScript array methods.

Parsing Other JSON Values

JSON.parse() can parse any valid JSON value.

Example

let value;

value = JSON.parse('"John"');

value = JSON.parse('42');

value = JSON.parse('true');

value = JSON.parse('null');

Common Use of JSON

A common use of JSON is to exchange data to/from a web server.

When receiving data from a web server, the data is a string:

'{"name":"John", "age":30, "city":"New York"}'

Use JSON.parse() to convert text string into a JavaScript object:

const text = '{"name":"John", "age":30, "city":"New York"}';

const person = JSON.parse(text);

Use data from the the object on your page:

Example

<p id="demo"></p>

<script>

// Display it in your HTML page

document.getElementById("demo").innerHTML = person.name;

</script>

The Reviver Function

The optional reviver argument is a callback function used to transform the parsed data.

It accepts two arguments: a property key and its value.

The return value replaces the original value:

• Transform a value: Return the transformed value.
• Leave unchanged: Return the original value.
• Delete a value: Return undefined.

Example

const text = '{"name":"John","age":"30"}';

const person = JSON.parse(text, function(key, value) {

// Convert the age to a number

  if (key == "age") {

    return Number(value);

  }

// Return other keys/values unchanged

  return value;

});

typeof person.age; // number

JSON does not support Date objects, so they are serialized as strings. A reviver can be used to convert date strings back into actual JavaScript Date instances upon parsing:

Example

let text = '{"event": "Conference", "date": "2026-07-22T11:28:00.000Z"}';

const myObject = JSON.parse(text, (key, value) => {

// Convert date string to a Date object

  if (key === "date") {

    return new Date(value); // Converts the string back to a Date object

  }

// Return other keys/values unchanged

  return value;

});

typeof myObject.date; // object

Invalid JSON

If the JSON text is not valid, JSON.parse() throws a SyntaxError.

Invalid JSON

const text = "{name:'John'}";

JSON.parse(text);

Note: The example above is invalid because of 2 reasons: Property names are not enclosed in double quotes. Strings cannot use single quotes.

Valid

{"name":"John"}

Handling Parse Errors

Use try...catch to handle invalid JSON.

Example

const text = "{name:'John'}";

try {

  const person = JSON.parse(text);

}

catch(err) {

  myDisplayer(err);

}

Common Parsing Mistakes

Parsing a JavaScript Object

JSON.parse() expects JSON text, not a JavaScript object.

Wrong

const person = {name: "John"};

const result = JSON.parse(person);

Parsing JSON Twice

After JSON has been parsed, the result is already a JavaScript value.

Wrong

const person = JSON.parse('{"name":"John"}');

const result = JSON.parse(person);

Note: Call JSON.parse() only when the value is a JSON text. Make sure the text is in JSON format, or else you will get a syntax error.