Preskočiť na hlavný obsah

Konvertor JSON do TypeScript zadarmo

Generujte TypeScript rozhrania alebo aliasy typov z ľubovoľného objektu alebo poľa JSON. Vložte JSON a okamžite získajte TypeScript typy pripravené na použitie.

Po načítaní funguje offline
export interface User {
  id: number;
  name: string;
  email: string;
  isActive: boolean;
  score: number;
  tags: string[];
  address?: null;
}

export interface Root {
  user: User;
  createdAt: string;
  version: number;
}

Bežné použitia

  • Generovať TypeScript typy z odpovedí APIVložte JSON odpoveď API a okamžite generujte rozhrania TypeScript na bezpečnú typizáciu kódu frontendu.
  • TypeScript typy pre konfiguráciu a objekty nastaveníGenerovať rozhrania TypeScript z konfiguračných súborov JSON, aby ste do nastavení aplikácie pridali bezpečnosť typov.
  • Generovať TypeScript typy z záznamov databázyKonvertujte exportované záznamy databázy JSON alebo výsledky dotazov ORM na rozhrania TypeScript pre typizáciu vrstvy údajov.
  • Typ údajov a testovacích vlákenGenerovať rozhrania TypeScript z údajov JSON a testovacích vláken na typizáciu jednotkových testov a príbehov Storybook.
  • Typ odpovedí API tretích stránGenerovať rozhrania TypeScript z odpovedí API tretích strán, kde chýbajú alebo sú zastarané oficiálne typy.

Ako to funguje

Tento nástroj používa ručne napísaný rekurzívny algoritmus odvodenia typov bez akýchkoľvek externých knižníc — JSON.parse na overenie a spracovanie vstupu, potom vlastné prechádzanie, ktoré prejde každú hodnotu v strome JSON a vygeneruje deklarácie rozhrania alebo typu TypeScript priamo v prehliadači. Nič sa neposiela na server.

  1. 1
    JSON spracovaný a overený
    Váš vstup sa odovzdá do JSON.parse. Ak zlyhá, presná chyba spracovania sa zobrazí okamžite pod vstupom. Úspešné spracovanie vytvorí typovaný strom hodnôt, ktorý riadi zvyšok prevodu.
  2. 2
    Rekurzívne odvodenie typov
    Rekurzívna funkcia getType prejde každý uzol: primitívy sa mapujú na string, number, boolean alebo null; objekty spustia nové pomenované rozhranie; polia objektov majú svoje kľúče zlúčené naprieč všetkými prvkami, takže kľúče prítomné iba v niektorých položkách sa stanú voliteľné a konfliktné typy hodnôt sa spoja pomocou |.
  3. 3
    Bezpečné pomenovanie rozhraní bez kolízií
    Každý vnorený objekt dostane názov v PascalCase odvodený z jeho kľúča JSON (snake_case, kebab-case a medzery sa všetky normalizujú). Ak by dva štrukturálne odlišné objekty zdieľali rovnaký názov, pridá sa číselná prípona (Data, Data2, …) namiesto tichého prepísania predchádzajúcej definície.
  4. 4
    Výstup vykreslený a stiahnuteľný
    Vnorené rozhrania sa vypíšu ako prvé, potom koreňový typ, formátovaný ako export interface alebo export type podľa vášho výberu. Výsledok sa dá skopírovať do schránky alebo stiahnuť ako súbor .ts — všetko zostavené pomocou štandardného Blob bez okruhu na server.

Súvisiace nástroje

Často kladené otázky