Ресурсы: HTTP JSON
JSON (JavaScript Object Notation) является текстовым форматом обмена данных и используется не только для передачи, но и для хранения данных.
JSON это набор пар "
ключ - значение", как и в объекте. Здесь правило такое, что все строки обязательно должны быть в двойных кавычках.
В качестве значений могут быть объекты, массивы, числа, строки, логические значения или
null. Будем разбирать на практике, допустим у нас есть какой-то объект
persone Код
const persone = {
name: 'Alex',
phone: '+74444444444'
}
Представим, что этот объект нам нужно передать на сервер, напрямую мы этого сделать не можем, так как сервер и протоколы передачи данных нас не поймут, и поэтому нам нужно его преобразовать в один из вариантов, который можно передавать.
Все современные браузеры имеют встроенные объекты
json для работы с этими данными и в этом встроенном объекте есть свои свойства и методы.
Метод stringify возвращает JavaScript-значение, преобразованное в JSON-строку.
Посмотрим как это работает с нашим объектом:
Код
console.log(JSON.stringify(persone));
Цитата
{"name":"Alex","phone":"+74444444444"}
По факту мы видим объект, но при этом все его свойства и значения заключены в двойные кавычки и уже в таком формате мы можем отправить эти данные на сервер.
Рассмотрим обратную ситуацию, когда нам с сервера приходят данные в формате
json, и нам нужно, к примеру, превратить их в обычный объект в нашем скрипте.
Метод parse разбирает строку JSON, возможно с преобразованием получаемого в процессе разбора значения.
Опять же на примере нашего объекта проводим обратную операцию преобразования:
Код
console.log(JSON.parse(JSON.stringify(persone)));
И в консоли мы уже увидим обычный объект:
Цитата
{ name: 'Alex', phone: '+74444444444' }
До появления
json использовался
«расширяемый язык разметки» xml. Вот как выглядел бы наш объект в этом формате:
Код
<?xml version="1.0" encoding="UTF-8"?>
<root>
<name>Alex</name>
<phone>+74444444444</phone>
</root>
Эта структура будет в итоге больше весить, она менее понята и более громоздкая.
Глубокое клонирование объектов с помощью JSON
Для наглядности сделаем наш объект чуть более вложенным, чтобы можно было делать глубокое копирование:
Код
'use strict';
const persone = {
name: 'Alex',
phone: '+74444444444',
parents: {
mom: 'Olga',
dad: 'Mike'
}
}
И если нам нужно сделать его глубокую копию, как раз и пригодится такая конструкция:
Код
const clone = JSON.parse(JSON.stringify(persone));
Вот эта операция превратит наш объект в формат json:
Код
JSON.stringify(persone)
А вот эта распарсит его обратно в объект, это будет глубокая копия нашего первоначального объекта, которая своершенно будет от него независимой:
Код
JSON.parse(JSON.stringify(persone))
И мы в этом можем убедиться, если попробуем поменять какие-то из вложенных значений:
Код
clone.parents.mom = 'Ann';
console.log(clone);
console.log(persone);
Цитата
{
name: 'Alex',
phone: '+74444444444',
parents: { mom: 'Ann', dad: 'Mike' }
}
{
name: 'Alex',
phone: '+74444444444',
parents: { mom: 'Olga', dad: 'Mike' }
}
И мы видим, что в первоначальном объекте ничего не поменялось, тогда как в его копии изменилось значение свойства
mom вложенного объекта.
Добавлять комментарии могут только зарегистрированные пользователи.
