I Shar

I Shar

мир глазами веб-разработчика

Методы объекта JSON

для чего нужны методы parse и stringify объекта JSON

I Shar

время чтения 2 мин.

Photo by Dlanor S on Unsplash

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

JSON.parse() получает в качестве аргумента JSON строку и преобразует ее в объект JavaScript.

Параметром метода JSON.stringify() является объект, который преобразуется в JSON строку.

Например:

const myObj = {
  name: 'Skip',
  age: 2,
  favoriteFood: 'Steak'
};
const myObjStr = JSON.stringify(myObj);
console.log(myObjStr);
// "{"name":"Skip","age":2,"favoriteFood":"Steak"}"
console.log(JSON.parse(myObjStr));
// Object {name:"Skip",age:2,favoriteFood:"Steak"}

Обычно эти методы применяются к объектам, но их можно использовать и для массивов:

const myArr = ['bacon', 'letuce', 'tomatoes'];
const myArrStr = JSON.stringify(myArr);
console.log(myArrStr);
// "["bacon","letuce","tomatoes"]"
console.log(JSON.parse(myArrStr));
// ["bacon","letuce","tomatoes"]

Json.parse()

Json.parse() может иметь и второй аргумент - функцию reviver, преобразующую значения объекта перед возвращением результата.

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

const user = {
  name: 'John',
  email: '[email protected]',
  plan: 'Pro'
};
const userStr = JSON.stringify(user);
JSON.parse(userStr, (key, value) => {
  if (typeof value === 'string') {
    return value.toUpperCase();
  }
  return value;
});

Использование строк с замыкающими запятыми для метода JSON.parse() недопустимо - это приводит к ошибке.

JSON.stringify()

JSON.stringify() может иметь два дополнительных аргумента: функцию или массив replacer и строчный или числовой аргумент space, применяемый для красивого форматирования результирующей строки.

Функция replacer может использоваться для фильтрации значений в процессе преобразования объекта в строку. Например, все значения, вернувшие в результате взаимодействия с функцией replacer результат undefined, будут исключены из итоговой строки:

const user = {
  id: 229,
  name: 'John',
  email: '[email protected]'
};
function replacer(key, value) {
  console.log(typeof value);
  if (key === 'email') {
    return undefined;
  }
  return value;
}
const userStr = JSON.stringify(user, replacer);
// "{"id":229,"name":"John"}"

А вот пример использования аргумента space для форматирования результирующей строки:

const user = {
  name: 'John',
  email: '[email protected]',
  plan: 'Pro'
};
const userStr = JSON.stringify(user, null, '...');
// "{
// ..."name": "John",
// ..."email": "[email protected]",
// ..."plan": "Pro"
// }"


Спасибо за внимание.

    • frontend
    • js

Новые публикации

Далее

Категории

О нас

Frontend & Backend. Статьи, обзоры, заметки, код, уроки.