Использование json. Формат JSON: что это такое, как создать и открыть файл. Создаем JavaScript переменную из JSON строки

19.03.2024 | Оргтехника

JSON или JavaScript Object Notation - это формат, реализующий неструктурированное текстовое представление структурированных данных, основанное на принципе пар ключ-значение и упорядоченных списках. Хотя JSON начал свое распространение с JavaScript, он поддерживается в большинстве языков, либо изначально, либо с помощью специальных библиотек. Обычно Json используется для обмена информацией между веб-клиентами и веб-сервером.

За последние 15 лет JSON стал формальным стандартом обмена данными и используется практически везде в интернете. Сегодня он используется практически всеми веб-серверами. К такой популярности привело еще и то, что многие базы данных поддерживали JSON. Современные реляционные базы данных, такие как PostgreSQL и MySQL теперь поддерживают хранение и экспорт данных в JSON. Базы данных, такие как MongoDB и Neo4j также поддерживают JSON, хотя MongoDB использует слегка модифицированную версию JSON. В этой статье мы рассмотрим что такое JSON, его преимущества над XML, его недостатки, а также когда его лучше использовать.

Чтобы понять зачем нужен формат JSON и как он работает не обойтись без практики. Сначала давайте рассмотрим такой пример:

{
“firstName”: “Jonathan”,
“lastName”: “Freeman”,
“loginCount”: 4,
“isWriter”: true,
“worksWith”: [“Spantree Technology Group”, “InfoWorld”],
“pets”: [
{
“name”: “Lilly”,
“type”: “Raccoon”
}
]
}

В этой структуре мы четко определили некоторые атрибуты человека. Сначала мы определили имя, фамилию, количество авторизаций в системе, является ли этот человек писателем, список компаний, с которыми он работает и список домашних животных. Такая или похожая структура может быть передана с сервера в веб-браузер или мобильное приложение, которое уже может делать все что нужно с этими данными, например, отобразить их или сохранить.

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

Почему вам следует использовать JSON?

Чтобы понять полезность и важность JSON нам нужно немного разобраться в истории интерактивности в интернет. В начале 2000 годов интерактивность работы веб-сайтов начала меняться. В то время браузер служил только для отображения информации, а всю работу по подготовке контента к отображению выполнял веб-сервер. Когда пользователь нажимал кнопку в браузере, запрос отправлялся на сервер, где собиралась и отправлялась страница HTML, готовая для отображения. Такой механизм был медленным и неэффективным. Это требовало, чтобы браузер повторно перерисовывал все на странице, даже если изменилась небольшая часть данных.

В то время передача тарификация выполнялась за количество переданных данных, поэтому разработчики понимали, что перезагрузка целой страницы обходится очень дорого и рассматривали новые технологии для улучшения пользовательского интерфейса. Тогда возможность создания веб-запросов в фоновом режиме, которая была добавлена в Internet Explorer 5 оказалась довольно жизнеспособным подходом к поэтапной загрузке данных для отображения. Вместо перезагрузки страницы, нажатие на кнопку просто выполнит веб-запрос, который будет работать в фоновом режиме. Содержимое будет обновлено, как только загрузится. Им можно управлять с помощью JavaScript, универсального языка программирования для браузеров.

Изначально данные передавались в формате XML, но он был сложным для его использования в JavaScript. В JavaScript уже были объекты, которые использовались для представления данных в языке, поэтому Дуглас Крокфорд взял синтаксис объектов JS и использовал его в качестве спецификации нового формата обмена данными, который назывался JSON. Этот формат было намного проще читать и разбирать в браузере на JavaScript. Вскоре разработчики начали использовать JSON вместо XML.

Сейчас быстрый обмен данными JSON является стандартом де-факто для передачи данных между сервером и клиентом, мобильными приложениями и даже внутренними системными службами.

JSON против XML

Как я говорил выше, основной альтернативой JSON был и является XML. Однако XML становится все менее распространенным в новых системах. И очень легко понять почему. Ниже приведен пример записи данных, которые вы видели выше в Json через XML:

Jonathan
Freeman
4
true

Spantree Technology Group
InfoWorld

Lilly
Raccoon

В дополнение к избыточности кода, по сути запись данных заняла в два раза больше места, XML еще вводит некоторую двусмысленность при анализе структуры данных. Преобразование XML в объект JavaScript может занять от десятков до сотен строк кода и требует тонкой настройки для каждого анализируемого объекта. Преобразование JSON в объект JavaScript выполняется в одну строчку и не требует каких-либо предварительных знаний об анализируемом объекте.

Ограничения JSON

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

Нет структуры. С одной стороны, это означает, что у вас есть полная гибкость для представления данных любым способом. С другой, вы можете легко хранить неструктурированные данные.
Только один тип чисел. поддерживается формат с плавающей запятой и двойной точностью IEEE-754. Это довольно много, но вы не можете использовать то многообразие числовых типов, что есть в других языках.
Нет типа даты. разработчики должны использовать строковые представления дат, что может вызвать несоответствие форматирования. Или же использовать в качестве даты количество миллисекунд, прошедших с начала эпохи Unix (1 января 1970).
Нет комментариев - вы не сможете делать аннотации для полей, которые требуют этого прямо в коде.
Подробность - хотя JSON менее подробный, чем XML, это не самый сжатый формат обмена данными. Для высокопроизводительных или специализированных служб вы захотите использовать более эффективные форматы.

Когда следует использовать JSON?

Если вы разрабатываете программное обеспечение, которое взаимодействует с браузером или нативным мобильным приложением, вам лучше использовать JSON. Использование XML считается устаревшим. Для связи между серверами JSON может быть не очень эффективным и лучше использовать инфраструктуру сериализации, похожую на Apache Avro или Apache Thrift. Даже здесь JSON - это не плохой выбор, и он может давать все что вам нужно. Но нет точного ответа что выбрать.

Если вы используете базы данных MySQL, ваша программа будет в большой степени зависеть от того, что делается в базе данных. В реляционных базах данных, которые поддерживают JSON считается хорошим тоном использовать его как можно меньше. Реляционные базы данных были разработаны для данных определенной схемы. Хотя большинство из них сейчас поддерживает формат данных JSON, производительность работы с ним будет значительно ниже.

Выводы

JSON - это формат данных, нацеленный в первую очередь на отправку данных между веб-серверами и браузерами или мобильными приложениями. Формат имеет простой дизайн и гибкость, его легко читать и понимать, а также легко работать с такими данными в большинстве языков программирования. Отсутствие строгой схемы обеспечивает гибкость формата, но такая гибкость иногда затрудняет чтение и понимание данных.

Возможно, вам придется трудно при работе с JSON в строго типизированных языках, таких как Scala или Elm, но широкое распространение формата предполагает, что есть утилиты и библиотеки, которые помогут даже при решении сложных задач. Теперь вы знаете что такое json и как его использовать.

Состоящих из пар атрибут - значение. Это наиболее распространенный формат данных, используемый для асинхронной связи между браузером и сервером, в значительной степени заменяющий XML (используется AJAX).

JSON - это независимый от языка формат данных, который был получен из JavaScript. С 2017 года многие языки программирования используют код для генерации и анализа данных в только в нем. Имена файлов JSON используют расширение.json.

История создания

Первоначально формат JSON разработал Дуглас Крокфорд в начале нулевых, и в последующем два конкурирующих стандарта (RFC 7159 и ECMA-404) определили его в 2013 году. Стандарт ECMA описывает только допустимый синтаксис, в то время как RFC охватывает некоторые основы безопасности и взаимодействия.

Кроме того, существует стандарт RFC 7493, который определяет ограниченный профиль, известный как I-JSON (сокращение от «Internet JSON»). Он стремится преодолеть некоторые проблемы взаимодействия. Каждый такой документ является действительным документом JSON.

Необходимость в создании этого формата выросла из потребности в реальном протоколе связи между сервером и браузером, осуществляемой в реальном времени без использования плагинов (таких, как Flash или Java-апплеты).

Развитие и применение

Как уже отмечено, Дуглас Крокфорд, будучи создателем компании StateSoftware, впервые обозначил и популяризировал формат JSON. Впоследствии соучредители договорились о создании системы, использующей стандартные возможности браузера, и предоставили абстракционный уровень для разработчиков для создания приложений с непрерывным дуплексным подключением к веб-серверу. При этом появилась возможность удерживать два HTTP-соединения открытыми и обрабатывать их до стандартного времени работы браузера, если обмен данными не производился. Соучредители провели обсуждение за круглым столом и проголосовали за то, чтобы назвать формат данных JSML или JSON, а также определить тип лицензии, по которому новая разработка станет доступна. В настоящее время формат имеет открытый исходный код.

Практическое использование

Веб-сайт JSON.org был запущен в 2002 году. В декабре 2005 года Yahoo! начал предлагать некоторые из своих веб-сервисов в этом формате. Google стал применять фиды JSON для своего веб-протокола GData только в декабре 2006 года.

Первоначально формат файла JSON предназначался для подмножества языка сценариев JavaScript (в частности, Standard ECMA-262 3rd Edition-December) и обычно использовался вместе с ним. Однако это не зависящий от языка данных формат. Код для разбора и генерации данных JSON доступен на многих языках программирования. На веб-сайте JSON перечислены все библиотеки.

Несмотря на то, что JSON-формат online изначально рекламировался и считался строгим подмножеством JavaScript и ECMAScript, он периодически допускает некоторые символы, не экранированные в строках, которые являются недопустимыми в строках JavaScript и ECMAScript.

Сам по себе JSON стал международным стандартом ECMA в 2013 году как стандарт ECMA-404, который в том же году использовался в RFC 7158 в качестве ссылки. В 2014 году RFC 7159 стал основной ссылкой на использование JSON в Интернете (например, MIME application/json).

Типы данных, синтаксис и пример

Основными типами данных JSON являются:

Число: десятичное число со знаком, которое может содержать дробную часть и может использовать экспоненциальную нотацию E, но не может включать не-числа (например, NaN). Формат не делает различий между целыми и числами с плавающей запятой. JavaScript использует формат двойной точности с плавающей запятой для всех своих числовых значений, но другие языки, реализующие JSON, могут кодировать их по-разному.

Строка: последовательность из нуля или больших символов Unicode. Строки разделяются знаками двойных кавычек и поддерживают синтаксис обратной косой чертой.
Литералы: любое из значений true или false.
Массив: упорядоченный список из нуля или более значений, каждый из которых может быть любого типа. Массивы используют квадратные скобки с запятыми.
Объект: неупорядоченный набор пар имя/значение, где имена (также называемые ключами) являются строками. Поскольку объекты предназначены для представления ассоциативных массивов, рекомендуется (хотя и не обязательно), чтобы каждый ключ был уникальным внутри него. Объекты разделяют фигурными скобками и используют запятые для разделения каждой пары, в то время как внутри каждой из них символ двоеточия отделяет ключ или имя от его значения.
Null: Пустое значение, использующее слово null.

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

Ранние версии (например, указанные в RFC 4627) требовали, чтобы действительный документ состоял только из объекта или типа массива, который мог содержать другие типы внутри них. Такой JSON-формат, пример которого можно найти на устаревших веб-страницах, в настоящее время не используется.

Проблемы с переносимостью данных

Несмотря на то, что Дуглас Крокфорд первоначально утверждал, что JSON является строгим подмножеством JavaScript, его спецификация фактически позволяет создавать документы, нечитаемые в JavaScript. В частности, JSON допускает, чтобы значения строк Unicode U + 2028 LINE SEPARATOR и U + 2029 PARAGRAPH SEPARATOR выглядели неэкранированными в цитируемых строках, а JavaScript - нет. Это является следствием того, что JSON запрещает только «управляющие символы». Для максимальной совместимости эти символы должны быть экранированы с обратной косой чертой. Эта тонкость важна при создании JSONP.

JSON-формат: чем открыть?

Документы JSON могут кодироваться в UTF-8, UTF-16 или UTF-32, кодировка по умолчанию - UTF-8. Эти стандарты поддерживают полный набор символов "Юникода", включая символы вне основной многоязыковой плоскости (от U + 10000 до U + 10FFFF). Однако, если они экранированы, эти символы должны быть написаны с использованием суррогатных пар UTF-16 - детали, пропускаемой некоторыми анализаторами JSON-формат. Чем открыть и как будет прочитан такой файл?

Числа в данном формате являются агностическими в отношении их представления в языках программирования. Нет никакого различия между целым числом и значением с плавающей запятой: некоторые реализации могут рассматривать 42, 42.0 и 4.2E + 1 как одно и то же число, в то время как другие могут не делать этого. Кроме того, отсутствуют требования в отношении таких вопросов, как переполнение, недостаточность, потеря точности или округление. Кроме того, формат JSON ничего не говорит об обработке подписанных нулей, независимо от того, является ли 0.0 отличным от -0.0. Большинство реализаций, использующих стандарт IEEE 754 с плавающей запятой, включая JavaScript, сохраняют знаковые нули, но не все реализации JSON могут это делать.

Использование в JavaScript

Поскольку формат JSON был получен из JavaScript и его синтаксис (в основном) является подмножеством языка, для анализа данных JSON можно использовать функцию JavaScripteval. Из-за проблемы с разбором терминаторов строк Unicode, рассмотренных в предыдущем разделе, функция eval должна выполнить их замену.

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

Правильно реализованный синтаксический анализатор принимает только действительный формат JSON, описание которого присутствует в системе, предотвращая непреднамеренное выполнение потенциально вредоносного кода.

С 2010 года в таких веб-браузерах как Firefox и Internet Explorer включена поддержка анализа и выгрузка в JSON-формат.

Неподдерживаемые собственные типы данных

Синтаксис JavaScript определяет несколько собственных типов данных, которые не включены в стандарт JSON: Карта, Установить, Дата, Ошибка, Регулярное выражение, Функция и некоторые другие. Эти типы данных JavaScript должны быть представлены некоторыми другими форматами, при этом обе программы согласовывают способ преобразования между типами. Сегодня существуют некоторые стандарты defacto, например, преобразование даты в строку, но ни один из них не является общепризнанным. Другие языки могут иметь различный набор собственных типов, которые должны быть сериализованы тщательно, чтобы иметь дело с этим типом преобразования.

Схема JSON

Схема служит для определения структуры данных JSON для проверки, документирования и управления взаимодействием. Она предоставляет своего рода контракт на данные, требуемые приложением, и способ их изменения.

Схема основана на концепциях из XML Schema (XSD), но является собственной. Как и в XSD, используются те же средства сериализации/десериализации как для схемы, так и для данных.

Schema - это интернет-проект, который в настоящее время находится в 5-й версии (выпущенной 13 октября 2016 года). Существует несколько валидаторов, доступных для разных языков программирования, каждый из которых обладает различным уровнем соответствия. Стандартного расширения файлов нет, но некоторые специалисты предлагают утвердить.schema.json.

Тип MIME

Официальным типом MIME для текста JSON является «application/json». Несмотря на то что в большинстве современных реализаций принят официальный MIME-тип, многие приложения продолжают обеспечивать унаследованную поддержку других типов MIME. Многие поставщики услуг, браузеры, серверы, веб-приложения, библиотеки, фреймворки и API используют, ожидают или распознают тип MIME, содержимое которого выглядит как «текст/json» или «текст/javascript». Известные примеры включают в себя Google Search API, Yahoo!, Flickr, Facebook API, DojoToolkit 0.4 и так далее.

JSON-RPC

JSON-RPC - это протокол удаленного вызова процедур (RPC), построенный на JSON, созданный в качестве замены для XML-RPC или SOAP. Это простой протокол, который определяет только несколько типов данных и команд. Он позволяет системе отправлять уведомления (информацию на сервер, который не требует ответа) и несколько вызовов на сервер, на которые можно ответить не по порядку.

AJAJ

Асинхронный JavaScript и JSON (или AJAJ) относятся к той же динамической методологии веб-страниц, что и Ajax, но вместо XML именно формат данных JSON является основным. AJAJ - это технология веб-разработки, которая обеспечивает возможность веб-страницы запрашивать новые данные после загрузки в браузер. Обычно он отображает их с сервера в ответ на действия пользователя на этой странице. Например, то, что пользователь вводит в поле поиска, клиентский код затем отправляет на сервер, который сразу же отвечает раскрывающимся списком соответствующих элементов базы данных.

Проблемы безопасности

Текст в JSON-формате определяется как объект сериализации данных. Однако его дизайн, как нестрогое подмножество языка сценариев JavaScript, создает несколько проблем безопасности. Они сосредоточены на использовании интерпретатора "Яваскрипт" для динамического выполнения текста JSON, как встроенного JavaScript. Это подвергает программу ошибочным или злонамеренным скриптам. Это серьезная проблема при работе с данными, извлекаемыми из Интернета.

Данный простой и популярный, но рискованный метод использует совместимость с функцией JavaScripteval.

Некоторые разработчики ошибочно полагают, что текст в формате JSON также является синтаксически аналогичным кодом JavaScript, хотя это только отчасти верно. Поэтому считается, что простой способ для JavaScript-программы анализировать данные в этом формате - использование встроенной функции JavaScripteval, которая была разработана для оценки выражений "Яваскрипт". Вместо использования специфического парсера сам интерпретатор, таким образом, используется для выполнения данных JSON, создавая естественные JavaScript-объекты. Однако этот метод является рискованным, если есть вероятность, что данные JSON могут содержать произвольный код "Яваскрипт", который затем будет выполнен так же. Если сначала не будут приняты меры для проверки данных, метод eval подвержен уязвимостям безопасности, когда данные и вся среда JavaScript не находятся под контролем одного доверенного источника.

Например, если данные не проверены, они подвергаются атакам вредоносного кода JavaScript. Такие нарушения также могут создавать опасность кражи данных, подделки аутентификации и другие потенциальные злоупотребления данными и ресурсами.

Таким образом, новая функция JSON.parse была разработана как более безопасная альтернатива eval. Она специально предназначена для обработки данных именно JSON, а не JavaScript. Первоначально она была запланирована для включения в четвертое издание стандарта ECMAScript, но этого не произошло. Она была впервые добавлена в пятую версию и теперь поддерживается основными браузерами.

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

Нет, действительно, что такое JSON?

Мы собираемся загрузить его на нашу страницу и использовать некоторые изящные манипуляции DOM, чтобы отобразить их, например:

Получение JSON

Чтобы получить JSON, мы будем использовать API, называемый XMLHttpRequest (часто называемый XHR ). Это очень полезный объект JavaScript, который позволяет нам делать сетевые запросы для извлечения ресурсов с сервера через JavaScript (например, изображения, текст, JSON, даже фрагменты HTML), что означает, что мы можем обновлять небольшие разделы контента без необходимости перезагрузки всей страницы. Это привело к более отзывчивым веб-страницам и звучит захватывающе, но, к сожалению, выходит за рамки этой статьи, чтобы учить его гораздо более подробно.

Начнем с того, что мы собираемся сохранить URL-адрес JSON, который мы хотим получить в переменной. Добавьте нижеследующий код JavaScript: var requestURL = "https://mdn.github.io/learning-area/javascript/oojs/json/superheroes.json";

Чтобы создать запрос, нам нужно создать новый экземпляр объекта запроса из конструктора XMLHttpRequest , используя ключевое слово new . Добавьте следующую ниже свою последнюю строку: var request = new XMLHttpRequest();

Теперь нам нужно открыть новый запрос, используя метод . Добавьте следующую строку: request.open("GET", requestURL);

Это занимает не менее двух параметров - есть другие доступные параметры. Нам нужен только два обязательных для этого простого примера:

Метод HTTP, который следует использовать при выполнении сетевого запроса. В этом случае прекрасен, так как мы просто извлекаем некоторые простые данные.
URL-адрес для запроса - это URL-адрес файла JSON, который мы сохранили ранее.

Затем добавьте следующие две строки: здесь мы устанавливаем в JSON, так что XHR знает, что сервер будет возвращать JSON и что это должно быть преобразовано за кулисами в объект JavaScript. Затем мы отправляем запрос методом : request.responseType = "json"; request.send();

Последний бит этого раздела предполагает ожидание ответа на возврат с сервера, а затем обращение с ним. Добавьте следующий код ниже вашего предыдущего кода: request.onload = function() { var superHeroes = request.response; populateHeader(superHeroes); showHeroes(superHeroes); }

Здесь мы сохраняем ответ на наш запрос (доступный в свойстве ) в переменной superHeroes ; эта переменная теперь будет содержать объект JavaScript, основанный на JSON! Затем мы передаем этот объект двум вызовам функций - первый из них заполнит правильными данными, а второй создаст информационную карту для каждого героя в команде и вставляет ее в .

Мы завернули код в обработчике событий, который запускается, когда событие загрузки запускается в объекте запроса (см. ) - это связано с тем, что событие загрузки запускается, когда ответ успешно возвращается; делая это таким образом, гарантирует, что request.response определенно будет доступен, когда мы приступим, чтобы попытаться что-то с этим сделать.

Заполнение заголовка

Теперь мы извлекли данные JSON и превратили его в объект JavaScript, давайте воспользуемся им, написав две функции, на которые мы ссылались выше. Прежде всего, добавьте следующее определение функции ниже предыдущего кода:

Function populateHeader(jsonObj) { var myH1 = document.createElement("h1"); myH1.textContent = jsonObj["squadName"]; header.appendChild(myH1); var myPara = document.createElement("p"); myPara.textContent = "Hometown: " + jsonObj["homeTown"] + " // Formed: " + jsonObj["formed"]; header.appendChild(myPara); }

Мы назвали параметр jsonObj , чтобы напомнить себе, что этот объект JavaScript возник из JSON. Здесь мы сначала создаем элемент с , устанавливаем его равным свойству squadName объекта, а затем добавляем его в заголовок с помощью . Затем мы выполняем очень похожую операцию с абзацем: создаем его, устанавливаем его текстовое содержимое и добавляем его в заголовок. Единственное различие заключается в том, что его текст задан как конкатенированная строка, содержащая как homeTown , так и formed свойства объекта.

Создание информационных карт героя

Затем добавьте следующую функцию внизу кода, которая создает и отображает карты супергероев:

Function showHeroes(jsonObj) { var heroes = jsonObj["members"]; for (var i = 0; i < heroes.length; i++) { var myArticle = document.createElement("article"); var myH2 = document.createElement("h2"); var myPara1 = document.createElement("p"); var myPara2 = document.createElement("p"); var myPara3 = document.createElement("p"); var myList = document.createElement("ul"); myH2.textContent = heroes[i].name; myPara1.textContent = "Secret identity: " + heroes[i].secretIdentity; myPara2.textContent = "Age: " + heroes[i].age; myPara3.textContent = "Superpowers:"; var superPowers = heroes[i].powers; for (var j = 0; j < superPowers.length; j++) { var listItem = document.createElement("li"); listItem.textContent = superPowers[j]; myList.appendChild(listItem); } myArticle.appendChild(myH2); myArticle.appendChild(myPara1); myArticle.appendChild(myPara2); myArticle.appendChild(myPara3); myArticle.appendChild(myList); section.appendChild(myArticle); } }

Для начала сохраним свойство members объекта JavaScript в новой переменной. Этот массив содержит несколько объектов, которые содержат информацию для каждого героя.

Затем мы используем для циклического прохождения каждого объекта в массиве. Для каждого из них мы:

Создаем несколько новых элементов: , , три

Установливаем , чтобы содержать name текущего героя.
Заполняем три абзаца своей secretIdentity , age и строкой, в которой говорится: «Суперспособности:», чтобы ввести информацию в список.
Сохраняем свойство powers в другой новой переменной под названием superPowers - это содержит массив, в котором перечислены сверхспособности текущего героя.
Используем другой цикл for , чтобы прокрутить сверхспособности текущего героя - для каждого из них мы создаем элемент
, помещаем в него сверхспособности, а затем помещаем listItem внутри элемента
- Последнее, что мы делаем, это добавить ,
  И
  - Пользователь кликает по превьюшке картинки
  - JavaScript обрабатывает это событие и посылает ajax запрос к PHP скрипту, передавая ID картинки.
  - На сервере, php получает описание картинки, имя картинки, адрес к большому изображению и другую информацию из базы данных. Получив, преобразовывает в JSON формат и отправляет обратно на страницу пользователя.
  - JavaScript получает ответ в виде JSON, обрабатывает данные, формирует html код и выводит увеличенное изображение с описанием и другой информацией.
  - В начале и конце мы использует фигурные дужки { и }, которые дают понять, что это объект.
  - Внутри объекта мы имеем несколько пар имя/значение:
  - "orderID": 12345 - поле с именем orderId и значение 12345
  - "shopperName": "John Smith" - поле с именем shopperName и значение John Smith
  - " shopperEmail": " johnsmith@ example. com" - подобно, как и в предыдущем поле, здесь храниться email покупателя.
  - "contents": [ ... ] - поле с именем content, значение которого массив.
  - "orderCompleted": true - поле с именем orderCompleted, значение которого true
  - Внутри массива contents, мы имеем два объекта, которые отображают содержимое корзины. Каждый объект продукта имеет три свойства: productID, productName, quantity.