JSON

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

Скрипт на странице тоже может обратиться к серверу: не за целой страницей, а только за данными. Интернет-магазин запрашивает свои товары, чат — новые сообщения, приложение с погодой — прогноз. Страница остаётся прежней, меняются только данные. Так одна страница может показывать тысячи разных товаров.

Данные передаются в виде текста, чаще всего в формате JSON (сокращение от JavaScript Object Notation; читается как «джейсон»). Файлы с данными в JSON имеют расширение .json. Вот список животных небольшого приюта:

[
    { "name": "Рекс", "species": "собака", "age": 3, "vaccinated": true },
    { "name": "Луна", "species": "кошка", "age": 2, "vaccinated": false }
]

Он выглядит точь-в-точь как массив объектов в JavaScript, отсюда и название. Но у JSON правила строже:

• Ключи всегда пишутся в двойных кавычках: "name", а не name.
• Текст тоже пишется в двойных кавычках. Одинарные, как в 'Рекс', не разрешены.
• После последнего элемента массива или последнего свойства объекта запятой нет.
• Комментариев, переменных и функций нет. Значения — это текст, числа, true, false, null, массивы и объекты.

Одна ошибка — и браузер вообще не сможет прочитать файл. В консоли тогда появится SyntaxError, в котором сказано, где он остановился: строка и столбец или текст рядом с ошибкой.

В упражнениях настоящего сервера нет, но его роль играет окно предпросмотра: скрипт может запросить любой файл упражнения и получает его через короткое время, словно с сервера в интернете. В этом упражнении скрипт уже готов: он запрашивает animals.json и показывает животных списком. Как он это делает — тема через одно упражнение. Пока вы работаете только с данными, в файле animals.json.