JSON Pretty Print: как форматировать JSON для удобочитаемости
Что такое JSON Pretty Printing?
JSON pretty printing — это процесс преобразования сырых, компактных (минифицированных) данных JSON и их переформатирования с правильными отступами, переносами строк и пробелами для обеспечения удобочитаемости для человека. Документ JSON, отформатированный в стиле pretty print, использует последовательные отступы и чёткое структурное форматирование, которое раскрывает иерархию вложенных объектов и массивов.
Сравните эти два представления одних и тех же данных:
Минифицированный (трудно читаемый):
{"users":[{"id":1,"name":"Alice","roles":["admin","editor"]},{"id":2,"name":"Bob","roles":["viewer"]}],"total":2}
Pretty Printed (легко читаемый):
{
"users": [
{
"id": 1,
"name": "Alice",
"roles": ["admin", "editor"]
},
{
"id": 2,
"name": "Bob",
"roles": ["viewer"]
}
],
"total": 2
}
Pretty Print и минифицированный JSON
Выбор между pretty-printed и минифицированным JSON зависит от сценария использования:
| Аспект | Pretty Print | Минифицированный | |--------|-------------|----------| | Удобочитаемость | Высокая — чёткая структура | Низкая — все данные на одной строке | | Размер файла | Больше (больше пробельных символов) | Меньше (без накладных расходов на пробелы) | | Сетевая передача | Медленнее для больших полезных нагрузок | Быстрее, меньше пропускной способности | | Отладка | Идеально для разработки | Непрактично для проверки | | Использование в production | Используется редко | Стандарт для ответов API |
Production API обычно предоставляют минифицированный JSON для снижения пропускной способности, в то время как разработчики используют pretty-print JSON во время разработки и отладки.
Стили отступов
Большинство форматтеров поддерживают два распространённых стиля отступов:
Отступ в 2 пробела (самый распространённый)
{
"name": "Alice",
"age": 30,
"address": {
"city": "New York"
}
}
Рекомендуется для: проектов на JavaScript/TypeScript, современной веб-разработки и большинства общих случаев использования.
Отступ в 4 пробела
{
"name": "Alice",
"age": 30,
"address": {
"city": "New York"
}
}
Рекомендуется для: проектов на Python (стиль PEP 8) и команд, предпочитающих более широкие отступы для наглядности.
Отступы табуляцией
Некоторые разработчики предпочитают отступы на основе табуляции, особенно в рабочих процессах, ориентированных на доступность, где пользователи настраивают ширину табуляции в своём редакторе.
Выбор правильного отступа
Большинство команд стандартизируются на 2 пробелах, потому что это обеспечивает баланс между удобочитаемостью и эффективностью использования горизонтального пространства. Экосистема JavaScript (Node.js, React, Vue) в подавляющем большинстве использует отступ в 2 пробела. Если вы работаете в среде с преобладанием Python, отступ в 4 пробела может казаться более естественным. Ключевой момент — последовательность: выберите один стиль и обеспечьте его соблюдение во всём проекте с помощью инструментов, таких как Prettier или EditorConfig.
JSON Pretty Print на разных языках программирования
JavaScript / Node.js
const formatted = JSON.stringify(data, null, 2);
console.log(formatted);
Python
import json
formatted = json.dumps(data, indent=2)
print(formatted)
Java
import com.fasterxml.jackson.databind.ObjectMapper;
ObjectMapper mapper = new ObjectMapper();
String formatted = mapper.writerWithDefaultPrettyPrinter()
.writeValueAsString(data);
Go
import "encoding/json"
formatted, _ := json.MarshalIndent(data, "", " ")
fmt.Println(string(formatted))
Ruby
require 'json'
puts JSON.pretty_generate(data)
Как выполнить Pretty Print JSON
Использование онлайн JSON форматтера
Самый быстрый способ — использовать бесплатный онлайн JSON форматтер — вставьте ваш JSON и получите мгновенный, отформатированный вывод с подсветкой синтаксиса и обнаружением ошибок.
Использование инструментов командной строки
С помощью jq (самый популярный):
cat file.json | jq .
С помощью Python:
python -m json.tool file.json
С помощью Node.js:
node -e "const d = require('./file.json'); console.log(JSON.stringify(d, null, 2));"
Инструменты разработчика браузера
Все основные браузеры автоматически форматируют ответы JSON в своих вкладках Network:
- Chrome DevTools: вкладка Network автоматически форматирует ответы JSON в стиле pretty print
- Firefox Developer Tools: ответы JSON отображаются с сворачиваемыми древовидными представлениями
- Safari Web Inspector: предпросмотр JSON включает автоматическое форматирование
IDE-плагины для форматирования JSON
VS Code
VS Code имеет отличную встроенную поддержку JSON. Используйте Shift+Alt+F (Windows/Linux) или Shift+Option+F (macOS) для форматирования любого файла JSON. Дополнительные расширения улучшают этот опыт:
- Prettier — последовательно форматирует JSON, JSONC и многие другие языки
- JSON Tools — сортировка, минификация и форматирование JSON с помощью сочетаний клавиш
- JavaScript Booster — расширенные функции манипуляции JSON
JetBrains IDE (IntelliJ, WebStorm, PyCharm)
- Встроенный форматтер:
Ctrl+Alt+L(Windows/Linux) илиCmd+Option+L(macOS) - Автоматическая валидация и форматирование JSON при вставке
Vim / Neovim
" Format JSON in place
:%!jq .
Расширенные возможности форматирования JSON
Современные форматтеры JSON предлагают больше, чем просто базовые отступы:
- Сортировка ключей — алфавитная сортировка ключей объектов для согласованного вывода
- Подсветка синтаксиса — цветовое выделение ключей, строк, чисел и булевых значений
- Сворачиваемые деревья — разворачивание и сворачивание вложенных структур для более удобной навигации
- Номера строк — указание конкретных местоположений при отладке
- Подсветка ошибок — визуальная отметка синтаксических ошибок с подробными сообщениями
Лучшие практики для удобочитаемости JSON
- Всегда проверяйте перед форматированием — форматтер не может исправить невалидный JSON. Сначала используйте JSON валидатор для обнаружения синтаксических ошибок.
- Установите командный стандарт — договоритесь об отступах (2 пробела являются отраслевым стандартом) и обеспечьте их соблюдение с помощью Prettier или линтера.
- Сохраняйте небольшую глубину вложенности — глубоко вложенный JSON (4+ уровня) трудно читать независимо от форматирования. По возможности рассмотрите реструктуризацию.
- Используйте осмысленные ключи — описательные, лаконичные имена ключей улучшают удобочитаемость больше, чем любой форматтер.
- Добавляйте завершающие переводы строк — завершайте файлы JSON символом новой строки для соответствия стандартам POSIX и избежания шума в diff.
Попробуйте наш бесплатный онлайн инструмент JSON pretty print для мгновенного форматирования и улучшения читаемости ваших данных JSON с настраиваемыми отступами и подсветкой синтаксиса.