Введение
Объект JSON
, доступный во всех современных браузерах, включает два полезных метода для работы с контентом в формате JSON: parse
и stringify
. JSON.parse()
берет строку JSON и трансформирует ее в объект JavaScript. JSON.stringify()
берет объект JavaScript и трансформирует его в строку JSON.
Приведем пример:
const myObj = {
name: 'Skip',
age: 2,
favoriteFood: 'Steak'
};
const myObjStr = JSON.stringify(myObj);
console.log(myObjStr);
// "{"name":"Sammy","age":6,"favoriteFood":"Tofu"}"
console.log(JSON.parse(myObjStr));
// Object {name:"Sammy",age:6,favoriteFood:"Tofu"}
Хотя данные методы обычно применяются к объектам, их можно использовать и в отношении массивов:
const myArr = ['bacon', 'lettuce', 'tomatoes'];
const myArrStr = JSON.stringify(myArr);
console.log(myArrStr);
// "["shark","fish","dolphin"]"
console.log(JSON.parse(myArrStr));
// ["shark","fish","dolphin"]
JSON.parse()
JSON.parse()
может принимать функцию в качестве второго аргумента, который может трансформировать значения объекта до их возврата. Здесь значения объекта трансформируются в верхний регистр в возвращаемом объекте метода parse
:
const user = {
name: 'Sammy',
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, и поэтому метод JSON.parse()
выдает ошибку в случае передачи в него строки, заканчивающейся на запятую.
JSON.stringify()
JSON.stringify()
может принимать два дополнительных аргумента, первый из которых представляет собой функцию replacer
, а второй — строковое
или числовое
значение, используемое в качестве пробела
в возвращаемой строке.
Функцию replacer можно использовать для фильтрации значений, поскольку любое значение, возвращаемое как undefined
, получается из возвращаемой строки:
const user = {
id: 229,
name: 'Sammy',
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":"Sammy"}"
Приведем еще пример с передачей аргумента space
:
const user = {
name: 'Sammy',
email: '[email protected]',
plan: 'Pro'
};
const userStr = JSON.stringify(user, null, '...');
// "{
// ..."name": "Sammy",
// ..."email": "[email protected]",
// ..."plan": "Pro"
// }"
Заключение
В этом учебном модуле мы узнали, как использовать методы JSON.parse()
и JSON.stringify()
. Если вы хотите узнать больше о работе с JSON в Javascript, ознакомьтесь с учебным модулем Работа с JSON в JavaScript.
Более подробную информацию о том, как программировать на JavaScript, можно найти в серии статей Программирование на JavaScript или на странице тем по JavaScript в разделе упражнений и проектов по программированию.