Vai al contenuto

Generatore di interfacce e tipi da JSON a TypeScript — Numio

Genera interfacce TypeScript o alias di tipo da un esempio JSON, come una risposta API. Gestisce annidamenti, null e array misti; la conversione avviene nel browser.

Converted in your browser. Null stays a value type; ? marks a field missing from some objects in an array. Empty arrays use unknown elements.

Carica un esempio (sostituisce il contenuto inserito)

JSON

TypeScript

Quando usarlo

  • Crea tipi TypeScript con nome per una risposta API.
  • Confronta più oggetti in un array per individuare tipi diversi e campi facoltativi.

Come si usa

  1. Incolla JSON reale oppure carica uno degli esempi. Caricare un esempio sostituisce l’input.
  2. Imposta il nome del tipo radice e scegli interface (gli oggetti annidati diventano tipi separati) oppure type (un solo alias di tipo con oggetti annidati inline).
  3. Controlla null, i campi facoltativi (?) e le unioni string/number, poi copia i tipi.

Input JSON

[{"id":1,"name":"Tokyo"},{"id":2}]

Output TypeScript (Root, interface)

export type Root = RootValueItem[];

export interface RootValueItem {
  id: number;
  name?: string;
}

Dettagli e limiti

Viene esaminato ogni elemento dell’array. Nell’esempio, name manca nel secondo oggetto e diventa quindi facoltativo; un campo presente con valore null diventa invece un’unione con null.

Un array vuoto produce unknown[]. Gli array misti diventano array di un tipo unione, non tuple di lunghezza fissa.

I tipi coprono solo ciò che compare nell’esempio. Non vengono dedotti campi mai presenti, formati di data o email, intervalli di valori o relazioni tra campi.

L’input deve essere JSON standard; rimuovi prima commenti o virgole finali con il formattatore JSON. Inserisci come stringhe gli ID con zeri iniziali.

L’input è limitato a 1.000.000 di caratteri, circa 64 livelli e 50.000 valori. I tipi TypeScript non convalidano i dati in fase di esecuzione.

FAQ

Devo generare un’interfaccia o un tipo?

Entrambi descrivono la stessa struttura. interface crea un’interfaccia con nome per ciascun oggetto annidato, facile da riutilizzare; type crea un solo alias di tipo con gli oggetti annidati scritti inline.

Può generare una classe TypeScript?

No, genera solo interfacce o alias di tipo. Se ti serve una convalida in fase di esecuzione, usa JSON in Zod e adatta lo schema alle tue regole.

Qual è la differenza tra null e un campo facoltativo?

{"name":null} ha un campo name il cui valore è null; {} non ha affatto name. null resta nel tipo, mentre ? viene aggiunto solo quando alcuni oggetti dello stesso array non hanno il campo.

Cosa produce un array JSON alla radice?

Un alias di tipo per l’array più un’interfaccia per gli elementi, come nell’esempio sopra, dove Root è RootValueItem[].

Specifiche e riferimenti