Как преобразовать JSON в интерфейсы TypeScript с вложенными объектами
Вставьте корректный непустой JSON, выберите TypeScript или Python и при необходимости задайте имя корневого типа. Инструмент создаст интерфейсы TypeScript или датаклассы Python, выводя типы полей и вложенных объектов из переданной структуры.
Когда преобразование JSON в типы действительно полезно
JSON to Code помогает получить исходный код по тексту JSON, когда нужно быстро подготовить типы для структуры ответа API, конфигурации или другого обмена данными. Инструмент поддерживает два варианта результата: интерфейсы TypeScript и датаклассы Python. Если вы не выбираете язык отдельно, используется TypeScript.
На вход подаётся именно JSON-текст. Структура результата зависит от значений в объекте: строки получают строковый тип, логические значения, такие как true и false, получают логический тип, а числа преобразуются в number в TypeScript или float в Python. Вложенные объекты также получают вложенные типы, а соответствующие поля ссылаются на них.
Такой подход удобен, когда у вас уже есть небольшой пример JSON и нужно представить его в форме, принятой в проекте. Перед преобразованием проверьте, что текст действительно содержит JSON, а не фрагмент с комментариями, лишними разделителями или описанием в свободной форме. Название корневого типа можно оставить стандартным Root либо задать самостоятельно, чтобы результат лучше соответствовал предметной области.
Как получить интерфейсы TypeScript или датаклассы Python
-
Подготовьте пример JSON. Вставьте непустой текст, начинающийся с корректного JSON-значения, обычно с объекта. Удалите комментарии, пояснения до или после структуры и лишние символы, которые не входят в JSON.
-
Вставьте текст в поле ввода инструмента. Пустая строка и строка, состоящая только из пробелов, не подходят: в таком случае код не создаётся. Если пример содержит синтаксическую ошибку, сначала исправьте её в исходном JSON.
-
Выберите язык результата. Для TypeScript будет создано описание объектов через объявления
interface. Для Python создаются объявления датаклассов. Не вводите название другого языка: поддерживаются только TypeScript и Python. -
При необходимости укажите имя корневого типа. Если оставить это поле без собственного названия, корневой тип называется
Root. Выберите имя, описывающее главный объект, напримерOrderResponseдля ответа с данными заказа. -
Запустите преобразование и просмотрите созданный исходный код. Сопоставьте поля с исходным JSON: строковые, логические и числовые значения должны быть представлены типами, соответствующими выбранному языку. Для вложенного объекта проверьте также отдельное вложенное объявление и тип поля, которое на него ссылается.
-
Перед использованием в проекте проверьте код на своих соглашениях об именовании и на реальной схеме данных. Если пример JSON содержит только один вариант структуры, результат отражает именно этот пример, поэтому дополнительные варианты полей стоит проверить отдельно.
Как читать результат и где проходят его границы
В результате для JSON-объекта ожидайте объявления типов, а не повтор исходного JSON. В TypeScript объект описывается через interface, поля получают типы по значениям, а вложенный объект получает собственное вложенное объявление. В Python результат оформляется как датакласс с полями, типы которых также выводятся из значений.
Например, представьте ситуацию: вы получили ответ заказа и вставили такой непустой JSON-текст: {"id":17,"paid":true,"customer":{"name":"Ирина"}}. Если выбрать TypeScript и задать имя корневого типа OrderResponse, форма результата должна содержать корневой интерфейс OrderResponse, числовое поле id типа number, логическое поле paid типа boolean, а также отдельный тип для вложенного объекта customer с полем name типа string. Это проверяемая форма результата, а не обещание конкретного расположения объявлений или форматирования.
Если выбрать Python для той же структуры, числовое поле представляется как float, логическое как bool, строковое как str, а вложенному объекту соответствует вложенный датакласс. Ошибка на этапе ввода означает, что сначала нужно исправить условие входа: убрать пустоту, сделать JSON синтаксически корректным или выбрать один из двух поддерживаемых языков. Сам созданный код следует рассматривать как основу для проверки в контексте вашего проекта, особенно если реальные данные могут отличаться от переданного примера.
Практический пример
Вы получили JSON с идентификатором заказа, признаком оплаты и вложенными данными клиента и хотите представить эту структуру в TypeScript.
Для ответа заказа вставьте указанный JSON, выберите TypeScript и задайте имя корневого типа OrderResponse, затем проверьте типы полей и вложенный объект в созданном коде.
Для TypeScript ожидаются корневой интерфейс OrderResponse, поле id типа number, поле paid типа boolean и отдельный тип вложенного customer с полем name типа string.
Ограничения
- Результат строится по переданному примеру JSON: он отражает его значения и вложенность, поэтому варианты структуры, отсутствующие в примере, нужно проверять отдельно в контексте проекта.
Частые ошибки
- Причина: в поле попал пустой текст или JSON с синтаксической ошибкой. Действие: удалите пробелы вне структуры, проверьте скобки, кавычки и запятые, затем повторите преобразование с непустым корректным JSON.
Частые вопросы
Можно ли преобразовать JSON с вложенными объектами в интерфейсы TypeScript?
Да, если текст непустой и синтаксически корректный. При выборе TypeScript объект представляется через объявления interface, а вложенные объекты получают связанные вложенные типы.
Какой результат получится при выборе Python?
Для Python создаются датаклассы, а строки, логические значения и числа получают типы str, bool и float соответственно.
Как изменить имя корневого типа?
Если не задать собственное имя, корневой тип называется Root. Вы можете указать другое имя, например OrderResponse, чтобы оно соответствовало главному объекту JSON.