URL: https://www.progressiverobot.com/js-json-parse-stringify-ru/

Введение

Объект 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.stringify illustration for: JSON.parse()

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

				
					
const user = {

 name: 'Sammy',

 email: 'Sammy@domain.com',

 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: 'Sammy@domain.com'

};



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: 'Sammy@domain.com',

 plan: 'Pro'

};



const userStr = JSON.stringify(user, null, '...');

// "{

// ..."name": "Sammy",

// ..."email": "Sammy@domain.com",

// ..."plan": "Pro"

// }"

				
			

Заключение

В этом учебном модуле мы узнали, как использовать методы JSON.parse() и JSON.stringify(). Если вы хотите узнать больше о работе с JSON в Javascript, ознакомьтесь с учебным модулем Работа с JSON в JavaScript.

Более подробную информацию о том, как программировать на JavaScript, можно найти в серии статей Программирование на JavaScript или на странице тем по JavaScript в разделе упражнений и проектов по программированию.