JSON Форматтер: Beautify & Validate JSON Онлайн Бесплатно
Мгновенное форматирование минимизированного JSON с правильными отступами. Бесплатный онлайн JSON форматтер проверяет синтаксис, улучшает код и ускоряет отладку. Работает в браузере с форматированием в реальном времени.
Форматтер JSON
Форматируйте и улучшайте внешний вид вашего JSON с помощью этого простого инструмента - форматирование происходит автоматически при наборе!
Отформатированный JSON появится здесь автоматически...
Документация
Что такое форматировщик JSON?
Форматировщик JSON — это инструмент, который берёт текст JSON (JavaScript Object Notation) и переписывает его с отступами и переносами строк, не изменяя сами данные. JSON — это текстовый формат для хранения и передачи структурированных данных, состоящий из пар «имя/значение» и списков. Программы обычно экономят место, удаляя все лишние пробелы, в результате чего получается одна плотная строка, которую человеку трудно читать. Форматировщик, также называемый beautifier или pretty printer, добавляет эти пробелы обратно единообразным образом, чтобы структура была видна. Этот инструмент автоматически форматирует JSON по мере ввода или вставки текста. Кнопки форматирования нет: вывод обновляется после каждого нажатия клавиши. Кнопка сброса очищает поле ввода, а кнопка копирования копирует отформатированный результат.
Правила синтаксиса JSON
JSON определяется спецификацией RFC 8259. В нём есть два типа контейнеров:
Объекты содержат пары «имя/значение» внутри фигурных скобок:
1{"name": "John", "age": 30, "city": "New York"}
2Массивы содержат упорядоченные списки внутри квадратных скобок:
1["apple", "banana", "cherry"]
2Значение в JSON должно иметь один из шести типов: строка, число, логическое значение (true или false), null, объект или массив.
Несколько правил становятся причиной большинства ошибок:
- Имена свойств должны быть заключены в двойные кавычки.
{name: "John"}недопустимо; должно быть{"name": "John"}. - Строки должны быть заключены в двойные, а не одинарные кавычки.
- После последнего элемента объекта или массива нельзя ставить запятую (замыкающие запятые не допускаются).
- В JSON нет синтаксиса комментариев, хотя его вид с фигурными и квадратными скобками происходит из JavaScript.
- В JSON нет значения
undefined. Для отсутствующего значения используйтеnull.
Распространённая ошибка — вставить литерал объекта JavaScript вместо JSON. {name: 'John', age: undefined} является допустимым JavaScript, но недопустимо в JSON. Версия JSON выглядит так: {"name": "John", "age": null}.
Как работает этот форматировщик JSON
Многие форматировщики JSON передают текст в JSON.parse(), чтобы создать объект JavaScript, а затем используют JSON.stringify(), чтобы преобразовать его обратно в текст с пробелами. У такого обратного преобразования есть побочный эффект: числа JavaScript представляют собой числа с плавающей точкой двойной точности IEEE 754 и не могут точно представить каждое целое после превышения значения 2^53 − 1 (9,007,199,254,740,991). Идентификатор 9007199254740993 после такого преобразования может превратиться в 9007199254740992.
Этот инструмент избегает такого шага. Он считывает входные данные посимвольно с помощью небольшого анализатора, написанного вручную, и вместо преобразования каждого числа или строки в значение JavaScript копирует этот фрагмент текста в точности как он записан, а затем помещает его на нужный уровень отступа. Поскольку числа никогда не преобразуются в числа с плавающей точкой, целые числа любого размера сохраняют свои точные цифры. Если один и тот же ключ объекта записан дважды, обе копии сохраняются на своих местах, а не заменяются последней, как произошло бы при создании объекта JavaScript.
Процесс по шагам:
- Считать следующий токен (объект, массив, строку, число,
true,falseилиnull). - Проверить его по грамматике JSON. Отклонить токен, если он нарушает правило, например содержит ключ без кавычек или замыкающую запятую.
- Скопировать текст токена в вывод без изменений.
- Добавить перенос строки и отступ размером 2 пробела для каждого уровня вложенности внутри объекта или массива. Пустой объект или массив остаётся в одной строке:
{}или[]. - Повторять, пока весь входной текст не будет прочитан.
Отступ фиксирован и равен 2 пробелам; изменить его нельзя. Пока поле ввода пусто, панель вывода показывает текст-заполнитель «Отформатированный JSON автоматически появится здесь...». Если входные данные нарушают правило JSON, инструмент показывает сообщение «Недопустимый JSON: проверьте введённые данные», а не техническое сообщение анализатора с точной позицией символа. Встроенная функция браузеров JSON.parse(), напротив, указывает позицию символа в тексте ошибки.
Пример расчёта
Этот минифицированный ввод:
1{"name":"John Doe","age":30,"address":{"street":"123 Main St","city":"Anytown","state":"CA"},"hobbies":["reading","hiking","photography"]}
2превращается в:
1{
2 "name": "John Doe",
3 "age": 30,
4 "address": {
5 "street": "123 Main St",
6 "city": "Anytown",
7 "state": "CA"
8 },
9 "hobbies": [
10 "reading",
11 "hiking",
12 "photography"
13 ]
14}
15Каждый вложенный объект или массив получает отступ на один уровень больше, чем его родитель, поэтому связь между address и тремя его полями сразу видна.
Второй пример показывает, почему важно копировать литералы. Этот ввод:
1{"id":9007199254740993}
2форматируется так:
1{
2 "id": 9007199254740993
3}
4Цифры остаются в точности такими, как были введены. Форматировщик на основе JSON.parse() с последующим вызовом JSON.stringify() вместо этого незаметно преобразовал бы это число в 9007199254740992.
Распространённые ошибки в JSON
- Имя свойства без кавычек:
{name: "John"}. Исправление:{"name": "John"}. - Замыкающая запятая:
{"age": 30,}. Исправление: удалите запятую перед закрывающей фигурной скобкой. - Несоответствующие скобки:
{"data": [1, 2}. Исправление: закройте массив скобкой]перед закрытием объекта. - Незакрытая строка:
{"name": "John}. Исправление: добавьте отсутствующую закрывающую кавычку. - Одинарные кавычки:
{'name': 'John'}. Исправление: используйте двойные кавычки. undefined,NaNилиInfinity: ни одно из этих значений не является допустимым значением JSON. Используйтеnullили строку.
Частый источник таких ошибок — копирование объекта непосредственно из консоли браузера или журнала сервера, где нередко встречается синтаксис, доступный только в JavaScript и требующий очистки, прежде чем текст станет допустимым JSON.
Когда использовать форматировщик JSON
Форматировщики JSON чаще всего используют для просмотра ответов API, которые обычно отправляются в минифицированном виде для экономии трафика. Их также применяют для ручной проверки конфигурационных файлов, таких как package.json или composer.json, чтения данных, скопированных из локального хранилища или консоли браузера, и понимания структуры набора данных, полученного из другой системы.
Другие способы форматирования JSON
- Инструменты разработчика браузера: Chrome, Edge и Firefox автоматически форматируют ответы JSON на панели предварительного просмотра вкладки Network.
- Редакторы кода: Visual Studio Code форматирует открытый JSON-файл сочетанием Alt+Shift+F (Shift+Option+F на Mac). В большинстве редакторов есть аналогичное сочетание клавиш или расширение для форматирования.
- Командная строка:
jq(jq . file.json) и встроенная в Python командаpython -m json.tool file.jsonформатируют JSON из терминала.
Встраивание форматирования JSON в код
Большинство языков программирования включают библиотеку JSON с возможностью указать отступ. В JavaScript:
1const formatted = JSON.stringify(JSON.parse(rawJson), null, 2);
2В Python:
1import json
2formatted = json.dumps(json.loads(raw_json), indent=2)
3Оба подхода разбирают текст в собственную структуру данных, а затем сериализуют его обратно с пробелами. Это просто реализовать, но числа могут измениться. JavaScript хранит каждое число как число двойной точности, поэтому 9007199254740993 возвращается как 9007199254740992. Python сохраняет целые числа точно, поскольку размер целых чисел в Python не ограничен, но всё равно переписывает 1.0e2 в 100.0 и преобразует 1e999 в Infinity, что недопустимо в JSON. Приложениям, которым нужны точные большие целые числа, например идентификаторы баз данных, часто приходится хранить их в JSON как строки, а не как числа.
Краткая история JSON
Дуглас Крокфорд определил JSON в начале 2000-х годов, взяв синтаксис из литералов объектов JavaScript, но сделав формат пригодным для использования из любого языка. RFC 4627 формализовал его в 2006 году. JSON быстро распространился, поскольку его было короче записывать, чем XML, и он напрямую отображался на объекты JavaScript; это стало важным, когда веб-приложения начали получать данные в фоновом режиме, не перезагружая страницы целиком. К 2010-м годам JSON стал стандартным форматом для REST API и таких баз данных, как MongoDB.
Часто задаваемые вопросы
Что такое форматировщик JSON? Инструмент, который добавляет к тексту JSON отступы, переносы строк и пробелы, чтобы его структуру было легко читать, не изменяя данные.
Изменяет ли форматирование данные? Нет. Форматирование изменяет только пробелы. Этот инструмент копирует каждую строку и число в точности так, как они были введены, поэтому значения в отформатированном выводе полностью совпадают со входными данными, включая числа, слишком большие для точного хранения в виде числа JavaScript.
Почему появляется ошибка «Invalid JSON»? Входные данные нарушают правило JSON. Распространённые причины — имена свойств без кавычек, замыкающая запятая, одинарные кавычки, незакрытая строка или несоответствующая скобка. Этот инструмент не показывает точную позицию ошибки; проверка входных данных по перечисленным выше правилам обычно быстро помогает её найти.
Может ли JSON содержать комментарии? Нет. Спецификация их не допускает. Такие форматы, как JSONC и JSON5, добавляют поддержку комментариев поверх синтаксиса JSON для случаев, когда это полезно, например в конфигурационных файлах.
Какой отступ в JSON считается стандартным? Наиболее распространённое соглашение в веб-разработке — два пробела; именно их использует этот инструмент. В некоторых руководствах по стилю вместо этого используются четыре пробела или табуляции, но сама спецификация JSON не требует конкретного отступа.
В чём разница между JSON.parse() и JSON.stringify()?
JSON.parse() преобразует строку JSON в значение JavaScript. JSON.stringify() выполняет обратное преобразование: превращает значение JavaScript в строку JSON и принимает аргумент, задающий отступ для красивой печати. Этот инструмент не использует ни одну из этих функций внутри, благодаря чему сохраняет большие целые числа в точности.