Vés al contingut principal

Convertidor JSON a TypeScript de franc

Genera interfícies TypeScript o àlies de tipus a partir de qualsevol objecte o matriu JSON. Enganxa el teu JSON i obtén tipus TypeScript llests per usar instantàniament.

Funciona sense connexió un cop carregat
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;
}

Usos habituals

  • Generar tipus TypeScript des de respostes APIEnganxeu una resposta JSON de l'API i genereu instantàniament interfícies TypeScript per als tipus segurs del codi frontend.
  • Tipus TypeScript per a configuració i objectes de configuracióGenereu interfícies TypeScript des dels arxius de configuració JSON per afegir seguretat de tipus a la configuració de l'aplicació.
  • Generar tipus TypeScript dels registres de base de dadesConvertiu registres de base de dades exportats per JSON o resultats de consulta ORM a interfícies TypeScript per a la tipificació de capa de dades.
  • Tipus de dades de simulació i utillatges de provaGenereu interfícies TypeScript des de dades de simulació JSON i utillatges de prova per escribir les proves unitàries i les històries de Storybook.
  • Tipus de respostes API de tercersGenereu interfícies TypeScript des de respostes API de tercers on falten o són obsolets els tipus oficials.

Com funciona

Aquesta eina utilitza un algorisme d'inferència de tipus recursiu escrit a mà sense cap biblioteca externa — JSON.parse per validar i analitzar l'entrada, i després un recorregut personalitzat que passa per cada valor de l'arbre JSON i emet declaracions d'interface o type de TypeScript directament al navegador. Res s'envia a cap servidor.

  1. 1
    El JSON s'analitza i es valida
    La teva entrada es passa a JSON.parse. Si falla, l'error exacte d'anàlisi es mostra immediatament sota l'entrada. Una anàlisi reeixida produeix un arbre de valors tipats que condueix la resta de la conversió.
  2. 2
    Inferència de tipus recursiva
    Una funció recursiva getType recorre cada node: els primitius es mapegen a string, number, boolean, o null; els objectes disparen una nova interface amb nom; les matrius d'objectes tenen les seves claus fusionades a través de tots els elements així les claus presents només en alguns elements esdevenen opcionals i els tipus de valor en conflicte s'uneixen amb |.
  3. 3
    Nomenament d'interfaces segur contra col·lisions
    Cada objecte niat rep un nom PascalCase derivat de la seva clau JSON (snake_case, kebab-case i espais es normalitzen tots). Si dos objectes estructuralment diferents compartissin el mateix nom, s'afegeix un sufix numèric (Data, Data2, …) en lloc de sobreescriure silenciosament la definició anterior.
  4. 4
    Sortida renderitzada i descarregable
    Les interfaces niades s'emeten primer, després el tipus arrel, formatat com a export interface o export type depenent de la teva selecció. El resultat es pot copiar al porta-retalls o descarregar com a fitxer .ts — tot construït amb un Blob estàndard i sense anada i tornada al servidor.

Eines relacionades

Preguntes freqüents