Введение в JSON

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

Это статья перевод An Introduction to JSON

Введение

JSON это сокращение от JavaScript Object Notation — формата передачи данных. Как можно понять из названия, JSON прозошел из JavaScript языка програмирования, но он доступен для использования на многих языках, включая Python, Ruby, PHP и Java, в англоязычным странах его в основном произносят как Jason, то есть как имя ДжЭйсон, в русскоязычных странах ударение преимущественно ставится на “о” — ДжисОн.

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

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

Синтаксис и структура

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

Вот так выглядит JSON объект:

{
“first_name” : “Sammy”,
“last_name” : “Shark”,
“location” : “Ocean”,
“online” : true,
“followers” : 987
}

Хоть это и короткий пример, и JSON мог бы быть гораздо длиннее, это показывает то, что этот формат в основном устанавливается двумя фигурными скобками, которые выглядят так { }, а данные с ключевыми значениями находятся между ними. Большинство используемых данных в JSON, заключаются в JSON объекты.

Пары ключевых значений имеют двоеточие между собой, как например тут “key” : “value”. Каждая пара значений разделена двоеточием, таким образом середина JSON выглядит так: “key” : “value”, “key” : “value”, “key”: “value”. В нашем примере выше, первая пара ключевых значений это “first_name” : “Sammy”.

Ключи JSON с левой стороны от двоеточия. Их нужно оборачивать в скобки, как с “key” это может быть любая строка. В каждом объекте, ключи должны быть уникальными. Такие ключевые строки могут содержать пробелы, как в “first name”, но такой подход может усложнить получение доступа к ним, во время процесса разработки, так что лучшим вариантом в таких случаях будет использование нижнего подчеркивания, как тут “first_name”.

JSON значения находятся с правой стороны от двоеточия. Если быть точным, то им нужно быть одним из шести типов данных: строкой, числом, объектом, массивом, булином или null значением.

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

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

Хоть в .json файлах мы обычно видим формат нескольких строк, JSON также может быть написан в одну сплошную строку.

{ “first_name” : “Sammy”, “last_name”: “Shark”, “online” : true, }

Такой подход наиболее распространен в файлах других форматов или при работе с JSON строкой.

Работа с JSON в многострочном формате зачастую делает его более читабельным, особенно когда вы пытаетесь справиться с большим набором данных. Так как JSON игнорирует пробелы между своими элементами, вы можете разделить их теми же самыми пробелами, чтобы сделать данные более читабельными:

{
“first_name” : “Sammy”,
“last_name” : “Shark”,
“online” : true
}

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

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

Работаем с комплексными типами в JSON

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

Вложенные объекты

В users.json файле ниже, для каждого из четырех пользователей (“sammy”, “jesse”, “drew”, “jamie”) есть вложенный JSON объект, передающий значение для каждого из пользователей, со своими собственными вложенными ключами “username” и “location”, которые относятся к каждому из пользователей. Первый вложенный JSON объект подсвечен ниже:

{
“sammy” : {
“username” : “SammyShark”,
“location” : “Indian Ocean”,
“online” : true,
“followers” : 987
},
“jesse” : {
“username” : “JesseOctopus”,
“location” : “Pacific Ocean”,
“online” : false,
“followers” : 432
},
“drew” : {
“username” : “DrewSquid”,
“location” : “Atlantic Ocean”,
“online” : false,
“followers” : 321
},
“jamie” : {
“username” : “JamieMantisShrimp”,
“location” : “Pacific Ocean”,
“online” : true,
“followers” : 654
}
}

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

Вложенные массивы

Данные также могут быть вложены в формате JSON, используя JavaScript массивы, которые передаются как значения. JavaScript использует квадратные скобки [ ] для определения массива. Массивы это упорядоченные коллекции и могут влключать в себя значения разнящихся типов данных.

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

В этом примере, первый вложенный массив подсвечен:

{
“first_name” : “Sammy”,
“last_name” : “Shark”,
“location” : “Ocean”,
“websites” : [
{
“description” : “work”,
“URL” : “https://www.digitalocean.com/"
},
{
“desciption” : “tutorials”,
“URL” : “https://www.digitalocean.com/community/tutorials"
}
],
“social_media” : [
{
“description” : “twitter”,
“link” : “https://twitter.com/digitalocean"
},
{
“description” : “facebook”,
“link” : “https://www.facebook.com/DigitalOceanCloudHosting"
},
{
“description” : “github”,
“link” : “https://github.com/digitalocean"
}
]
}

Ключи “websites” и “social_media”, каждый используют массив для вложения информации о сайтах пользователя и профайлов в социальных сетях. Мы знаем, что это массивы из-за квадратных скобок.

Использование вложенности в нашем JSON формате, позволяет нам работать с наиболее сложными и иерархичными данными.

Сравнение с XML

XML расшифровывается как eXtensible Markup Language. Это способ хранения доступных данных, которые могут быть прочитаны как людьми, так и машинами. Формат XML доступен для использования во многих языках программирования.

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

Мы посмотрим на пример XML формата и затем сравним его рендер в JSON.

<users>
<user>
<username>SammyShark</username> <location>Indian Ocean</location>
</user>
<user>
<username>JesseOctopus</username> <location>Pacific Ocean</location>
</user>
<user>
<username>DrewSquir</username> <location>Atlantic Ocean</location>
</user>
<user>
<username>JamieMantisShrimp</username> <location>Pacific Ocean</location>
</user>
</users>

А вот это уже формат JSON:

{“users”: [
{“username” : “SammyShark”, “location” : “Indian Ocean”},
{“username” : “JesseOctopus”, “location” : “Pacific Ocean”},
{“username” : “DrewSquid”, “location” : “Atlantic Ocean”},
{“username” : “JamieMantisShrimp”, “location” : “Pacific Ocean”}
] }

Тут мы видим, что JSON более компактный и не требует тегов закрытия как в XML. Более того, XML не может использовать массивы, как в примере с JSON.

Если вы знакомы с HTML, то вы подметите то, что XML выглядит довольно схоже по тегам. Хоть JSON компактнее и менее многословен, чем XML, а также быстр в использовании во многих ситуациях, включая AJAX, вам понадобится понять тип проекта над которым вы работаете, перед принятием решения — какую структуру данных использовать.

Ресурсы

JSON это нейтральный формат для использования и он имеет множество имплементаций для использования во многих языках програмирования. Вы можете увидеть полный список поддерживаемых языков на “Introducing JSON”

В большинстве случаев вам не придется писать чистый JSON, но вы будете доставать его из источников данных или конвертировать другие дата файлы в JSON. Вы можете сконвертить CSV или табуляционные данные из таких программ как Exel и т. п в JSON, используя open-source инструмент Mr. Data Converter. Вы также можете сконвертировать XML в JSON и наоборот на http://www.utilities-online.info/xmltojson/. Но помните, что используя инструменты автоматизации, вы должны всегда проверять ваши результаты и удалять все лишнее.

Переводя другие типы данных в JSON или создавая свой собственный, вы можете валидировать свой JSON на JSONLint http://jsonlint.com/ и можете протестировать его в котексте веб-разработки на JSFiddle.

Заключение

JSON это легкий формат, который позволяет вам легко делиться, хранить и работать с данными. Как формат, JSON переживает растущую поддержку API, включая Twitter API.

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