JavaScript метод JSON.parse()

Определение и применение

JavaScript метод .parse() объекта JSON является глобальной функцией, предназначенной для анализа (парсинга) строк в формате JSON, при необходимости преобразует и возвращает значения, полученные в ходе анализа.

В качестве возвращаемого значения вы можете получить объект, массив или элементарное значение, полученное в результате анализа переданной строки в формате JSON.

Для того, чтобы преобразовать элементарные значения, объекты, или массивы в строку в формате JSON вы можете воспользоваться глобальной функцией JSON.stringify() (се­риа­ли­зу­ет объ­ект, мас­сив или эле­мен­тар­ное зна­че­ние).

Поддержка браузерами

Метод	Chrome	Firefox	Opera	Safari	IExplorer	Edge
JSON.parse()	Да	Да	Да	Да	8.0	Да

JavaScript синтаксис:

JSON.parse(text);
JSON.parse(text, reviver);

text - String
reviver - Function

Спецификация

Значения параметров

Исключения

Пример использования

Базовый анализ строк в виде JSON

В следующем примере мы с Вами рассмотрим как с помощью глобальной функции JSON.parse() объекта JSON произвести анализ строк в формате JSON и вернуть значения, полученные в ходе анализа.

// инициализируем три переменные, содержащие строки в формате JSON
const jsonString = '{"a":true, "b":10, "c": ["c1", "c2", "c3"], "d":{"d1": 1, "d2": 2, "d3": 3}}',
      jsonString2 = '["a", "b", {"c": false}]',
      jsonString3 = '"test"';

// анализируем переданные строки и инициализируем переменные, полученным значением
const obj = JSON.parse(jsonString),
      obj2 = JSON.parse(jsonString2),
      obj3 = JSON.parse(jsonString3);

// выводим в консоль значения переменных
console.log(obj);
{a: true, b: 10, c: ["c1", "c2", "c3"], d: {d1: 1, d2: 2, d3: 3}}

console.log(obj2);
["a", "b", {c: false}]

console.log(obj3);
"test"

В этом примере мы инициализируем три переменные, которые содержат строки в формате JSON. С помощью метода JSON.parse() мы анализируем переданные строки и инициализируем переменные, полученным значением. Для демонстрации работы метода JSON.parse() выводим полученные значения в консоль.

Использование функции для преобразования JSON

В этом примере мы рассмотрим использование второго аргумента метода JSON.parse() - функции, которая позволяет преобразовать значение, полученное в ходе анализа перед его возвращением из метода:

// инициализируем переменную, содержащую строку в формате JSON
const jsonString = '{"a": 1,"b": false,"c": "3"}';

// преобразуем значение, полученное в ходе анализа таким образом, что оставляем только те свойства значения которых не являются числами
const obj = JSON.parse( jsonString, (key, val) => typeof val !== "number" ? val : undefined );
console.log(obj);
{b: false, c: "3"}

// преобразуем значение, полученное в ходе анализа таким образом, что оставляем только те свойства значения которых являются числами
const obj2 = JSON.parse( jsonString, (key, val) => typeof val === "number" || key === "" ? val : undefined );
console.log(obj2);
{a: 1}

// преобразуем значение, полученное в ходе анализа таким образом, что изменяем все числовые значения на 777
const obj3 = JSON.parse( jsonString, (key, val) => typeof val === "number" ? val = 777 : val );
console.log(obj3);
{a: 777, b: false, c: "3"}

// преобразуем значение, полученное в ходе анализа таким образом, что изменяем значение свойства "b" на "deleted"
const obj4 = JSON.parse( jsonString, (key, val) => key === "b" ? val = "deleted" : val );
console.log(obj4);
{a: 1, b: "deleted", c: "3"}

В этом примере с использованием функции метода JSON.parse() (второй аргумент), предназначенной для преобразования значения, полученного в ходе анализа перед его возвращением из метода мы:

• В первом случае оставляем только те свойства значения которых не являются числами.
• Во втором случае оставляем только те свойства значения которых являются числами. Обратите внимание, что последний вызов функции осуществляется с пустым ключом, по этой причине мы добавляем дополнительную проверку. В описании аргумента есть пояснение этому.
• В третьем случае изменяем все числовые значения на 777.
• В четвертом случае изменяем значение свойства "b" на "deleted".

Глубокое копирование объекта

Глубокое копирование объекта в отличии от поверхностного дублирует каждый встреченный ею объект, то есть копия и исходный объект не будут разделять общие элементы, поэтому она в действительности будет являться полноценной копией оригинала.

Давайте рассмотрим как с помощью методов JSON.parse() и JSON.stringify() сделать глубокую копию нашего объекта:

// инициализируем переменную, содержащую объект
let obj = {
    a: 1,
    b: {
      c: 2
    }
};

// осуществляем глубокое копирование объекта и инициализируем переменную
let newObj = JSON.parse( JSON.stringify( obj ) );
console.log( newObj );  // переменная содержит значение { a: 1, b: { c: 2} }

obj.b.c = 200;          // изменяем значение свойства объекта obj
console.log( obj );     // переменная содержит значение { a: 1, b: { c: 200} }
console.log( newObj );  // переменная содержит значение { a: 1, b: { c: 2} } 

В этом примере с использованием метода JSON.stringify() мы преобразовали значение переменной obj в строку JSON, а с помощью метода JSON.parse() анализируем эту строку и возвращаем новый объект, соответствующий переданной строке. В результате чего, свойства, значением которых является объект имеют собственные значения, а не ссылаются на первоначальный объект. Благодаря этим преобразованиям мы получаем новый объект, который является действительно полноценной копией оригинала.