Перейти к содержанию
TextArray
100% локально

JSON в TypeScript

Создавайте интерфейсы TypeScript из документа JSON с вложенными объектами в качестве именованных подинтерфейсов.

Входные данные
Выходные данные

JSON в TypeScript

Вставьте документ JSON — ответ API, файл конфигурации, строку базы данных — и получите готовые к использованию объявления TypeScript. Типы выводятся рекурсивно: примитивы сопоставляются со строками, числами и логическими значениями, массивы содержат тип своего элемента, а смешанные массивы становятся чистыми объединениями, такими как (число | строка)[]. Каждый вложенный объект становится именованным субинтерфейсом, производным от ключа его свойства в PascalCase, поэтому свойство «пользователь» создает пользовательский интерфейс, который можно импортировать и ссылаться где угодно.

Идентичные формы обнаруживаются и повторно используют один интерфейс вместо создания дубликатов; числовой суффикс появляется только в том случае, если два объекта имеют одно и то же ключевое имя, но различаются по структуре. Пустые массивы отображаются как неизвестные[], а пустые объекты — как Record<string,known> — честные заполнители, а не догадки. Имена свойств, которые не являются допустимыми идентификаторами, заключаются в кавычки автоматически, поэтому регистр кебаба и числовые ключи сохраняются без изменений.

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

Все работает локально в вашем браузере: ответы API с токенами, пользовательскими записями или внутренними полезными данными никогда не покидают ваш компьютер. Вставьте, скопируйте объявления в свою кодовую базу, и форма ваших данных будет введена.

FAQ

Как типизируются вложенные объекты и массивы?
Вложенные объекты становятся именованными субинтерфейсами, производными от ключа их свойства в PascalCase. Массивы принимают тип своего элемента; когда элементы различаются, типом является объединение, например (число | строка)[]. Массив объектов одинаковой формы повторно использует один интерфейс для всех элементов.
Что происходит с двумя объектами одинаковой формы?
У них общий интерфейс — генератор сравнивает структуры и повторно использует имя. Числовой суффикс, такой как Item2, появляется только в том случае, если два свойства имеют один и тот же ключ, но совершенно разные формы.
Как обрабатываются нулевые значения?
По умолчанию свойство null имеет тип null, как и указано в примере. Включите «Дополнительные свойства для нулевых значений», чтобы вместо этого выдавать prop?:known — полезно, когда значение null означает «иногда отсутствует» в вашем API.
Почему мой пустой массив имеет тип «неизвестный[]»?
Пустой массив не содержит данных о типе своего элемента, поэтому честный ответ — неизвестное[]. Добавьте в выборку один репрезентативный элемент, и генератор определит реальный тип.
Загружен ли где-нибудь мой JSON?
Нет. Инструмент полностью работает в вашем браузере, и ваши данные никогда не покидают ваше устройство — это безопасно для ответов API, содержащих токены или личные данные.