Защо да конвертирате JSON към TypeScript?

TypeScript използва статични типове, за да открива bugs по време на компилация, а не по време на изпълнение. При работа с APIs, конфигурационни файлове или всякакви външни източници на данни, които връщат JSON, обикновено трябва да дефинирате типове или интерфейси, описващи структурата на тези данни. Ръчното писане на тези дефиниции е трудоемко и податливо на грешки, особено при дълбоко вложени обекти или големи масиви с различни структури. Автоматизирането на конвертирането спестява време и намалява риска от несъответствия между вашите типове и реалните данни.

Описание на инструмента

Този инструмент приема всеки валиден JSON вход — обекти, масиви или вложени структури — и незабавно генерира съответстващи TypeScript псевдоними на типове или интерфейси. Той автоматично открива вложени обекти, създава отделни именувани типове за всеки от тях и обработва масиви чрез извеждане на типовете на елементите. Можете да превключвате между режими на изход interface и type в зависимост от конвенциите на вашия проект.

Примери

Входен JSON:

{
  "id": 1,
  "name": "Alice",
  "email": "alice@example.com",
  "address": {
    "street": "123 Main St",
    "city": "Springfield",
    "zip": "62701"
  },
  "roles": ["admin", "editor"]
}

Изход (режим Interface):

interface RootObject {
  id: number;
  name: string;
  email: string;
  address: Address;
  roles: string[];
}

interface Address {
  street: string;
  city: string;
  zip: string;
}

Изход (режим Type):

type RootObject = {
  id: number;
  name: string;
  email: string;
  address: Address;
  roles: string[];
};

type Address = {
  street: string;
  city: string;
  zip: string;
};

Функционалности

  • Избор между изход interface или псевдоним type чрез едно падащо меню
  • Автоматично откриване и извличане на типове на вложени обекти
  • Извеждане на типа на елементите в масиви, включително масиви от обекти
  • Обединяване на различни форми на обекти в масиви в един унифициран тип с незадължителни свойства
  • Конвертиране в реално време с редактори за JSON и TypeScript със синтактично оцветяване

Случаи на употреба

  • Бързо дефиниране на TypeScript типове за отговори от API по време на frontend разработка
  • Генериране на дефиниции на типове от JSON конфигурационни файлове или експорти от бази данни
  • Начално изграждане на типово-безопасни модели на данни при стартиране на нов TypeScript проект

Как работи

Инструментът анализира валиден JSON и рекурсивно обхожда структурата. За всеки срещнат обект създава именуван интерфейс или псевдоним на тип с полета, съответстващи на ключовете на обекта. Вложените обекти генерират допълнителни типове, към които се препраща по име. Масивите се анализират, за да се определи типът на елемента — ако всички елементи са обекти, техните форми се обединяват в един тип, при който ключовете, отсъстващи в някои елементи, стават незадължителни.

Съвети

  • Поставете представителна извадка от вашите JSON данни. Колкото по-пълна е извадката, толкова по-точни ще бъдат генерираните типове.
  • За масиви с различни форми на обекти включете множество обекти, за да може инструментът да открие незадължителните полета.
  • Използвайте режим Type, ако вашият проект предпочита псевдоними на типове за форми на обекти, или режим Interface, ако следвате конвенцията за интерфейси.