Как пользоваться
- Вставьте JSON в поле ввода, откройте файл .json или попробуйте пример.
- Задайте имя корневого типа, например Order или ApiResponse.
- Выберите объявления interface или type, а также нужно ли добавить export и readonly.
- Скопируйте сгенерированный TypeScript или скачайте его как types.ts.
Как это работает
Генератор обходит весь JSON-документ и фиксирует типы значений в каждом месте. Каждый JSON-объект становится отдельным именованным объявлением. Имя формируется из ключа свойства в PascalCase, поэтому «shipping_address» становится ShippingAddress. Элементы массива получают имя по единственному числу ключа: «items» даёт Item, «categories» — Category, а к ключам, которые не выглядят как множественное число, добавляется суффикс «Item».
Все объекты внутри одного массива объединяются в один интерфейс. Если ключ встречается только в некоторых из них, он помечается как необязательный знаком «?». Если значение имеет разные типы в разных местах, тип становится объединением, например string | number. null сохраняется как отдельный тип, поэтому поле, которое иногда равно null, становится string | null. Пустой массив становится unknown[], поскольку из него нечего вывести. Два объекта с одинаковыми свойствами и типами используют один общий интерфейс, а не создают дубликаты. Ключи, не являющиеся допустимыми идентификаторами, например «first-name», заключаются в кавычки.
Результат описывает только вставленный пример. Поле, которое в реальности может быть необязательным или принимать null, будет обязательным и не допускающим null, если в вашем примере это не отражено, а даты приходят как обычные строки. Проверьте типы по документации вашего API, прежде чем на них полагаться.
Примеры
Типизация ответа API
Вставьте заказ из API вашего магазина с корневым именем Order. Вы получите интерфейсы Order, Customer, Item и Shipping, а в Item — поле note?: string, потому что примечание есть только у одной из двух позиций.
Конфигурация только для чтения
Вставьте config.json, отметьте «Сделать свойства доступными только для чтения» и вставьте результат в config.d.ts, чтобы случайные изменения конфигурации выявлялись компилятором.
Массив на верхнем уровне
Эндпоинт списка возвращает [{…}, {…}]. С корневым именем Product результат начинается со строки «export type Product = ProductItem[];», за которой следует интерфейс ProductItem.
Часто задаваемые вопросы
Почему поле в выводе необязательное?
Потому что как минимум у одного объекта в том же массиве нет этого ключа. Если ключ есть у каждого объекта, он становится обязательным. Вставьте несколько записей, чтобы точнее определить необязательные поля.
Почему дата получает тип string?
В JSON нет типа «дата», поэтому даты передаются строками. Генератор не угадывает формат. Если ваш код преобразует их в объекты Date, измените тип самостоятельно.
В чем разница между interface и type?
Для объектов они работают почти одинаково. Интерфейсы можно расширять и объединять повторными объявлениями, а псевдонимы типов (type aliases) нельзя переоткрыть. Выберите стиль, который уже принят в вашей кодовой базе.
Может ли он генерировать проверку во время выполнения, например схемы Zod?
Нет. Он создаёт только декларации TypeScript, которые проверяются во время компиляции и не проверяют данные во время выполнения.
Конфиденциальность
Ваш JSON анализируется только в вашем браузере. Ничего не загружается, не сохраняется и не попадает в аналитику.