JSON в интерфейсы TypeScript
Создавайте интерфейсы или псевдонимы типов TypeScript по образцу JSON: необязательные ключи, объединения с null и вложенные типы, выведенные из массивов. Бесплатно и приватно.
Ключи, отсутствующие в части элементов массива, становятся необязательными (?), null — "| null", а значения, которые всегда null, — unknown.
Работает полностью в вашем браузере. Ваши данные никуда не загружаются.
Похожие Инструменты
Просмотреть ВсеЧто такое JSON в TypeScript?
Вставьте образец ответа API или конфигурации и получите готовые объявления TypeScript interface (или type). Вложенные объекты становятся отдельными экспортируемыми типами, ключи, отсутствующие у части элементов массива, становятся необязательными, а значения null — типами-объединениями.
Как пользоваться JSON в TypeScript
- Вставьте образец JSON в поле Входной JSON (либо нажмите Загрузить пример или Открыть файл).
- Задайте Имя корневого типа (по умолчанию
Root). - Выберите Стиль вывода:
interfaceили псевдоним type. - Скопируйте сгенерированный код TypeScript или нажмите Скачать, чтобы сохранить его в файл.
Пример
{"id":1,"name":"A","tags":["x"]} export interface Root {
id: number;
name: string;
tags: string[];
} Когда использовать JSON в TypeScript
Используйте для быстрого описания типов ответов fetch, тестовых данных и конфигурационных файлов. Один образец не покажет все случаи: строковые перечисления, объединения форм объектов и строки с датами остаются обычными типами string или объединёнными типами, поэтому проверьте результат и доработайте его либо используйте генератор на основе JSON Schema для контрактов.
Как работает JSON в TypeScript
Образец обходится рекурсивно, и каждая позиция собирает встреченные в ней типы. Массивы объектов объединяются в один тип: ключ, отсутствующий у части элементов, становится необязательным, ключ, который где-то равен null, получает допустимое значение null, целые числа вперемешку с дробными становятся типом с плавающей точкой, а всё остальное со смешанными типами сводится к динамическому типу. Вложенные объекты становятся собственными именованными типами (PascalCase от ключа, ключи-массивы переводятся в единственное число: orders → Order), а при совпадении имён добавляются числовые суффиксы. В TypeScript целые и дробные числа превращаются в number, строки — в string, логические значения — в boolean, массивы — в T[], значения с null — в T | null, а динамические — в unknown. Ключи, не являющиеся допустимыми идентификаторами, берутся в кавычки ("first-name": string).
Распространенные Случаи Использования
- Описание типа ответа REST API до написания клиента
- Создание интерфейсов для конфигурационного файла JSON
- Преобразование тестовых данных в типизированные объекты
- Быстрый старт типов для полезной нагрузки стороннего вебхука
Часто Задаваемые Вопросы
Почему свойство получило тип unknown?
Его значение во всех образцах было null (или массивы были пусты), поэтому реальный тип вывести не удалось. Добавьте образец с настоящим значением или поправьте тип вручную.
Как определяются необязательные свойства?
Когда значение верхнего уровня или вложенный ключ — массив объектов, ключ, присутствующий лишь у части объектов, помечается знаком ?.
Создаётся ли проверка данных во время выполнения?
Нет, выдаются только объявления типов, которые исчезают при компиляции. Если нужны проверки во время выполнения, используйте валидатор, например JSON Schema.