Come generare TypeScript da JSON
- Incolla un esempio JSON. Più elementi contengono i suoi array, meglio vengono rilevati i campi opzionali e le union.
- Imposta il nome del tipo radice e scegli
interfaceotype, con o senzaexportereadonly. - Copia il codice TypeScript nel tuo progetto o scaricalo come file
.ts.
Come vengono dedotti i tipi TypeScript dal JSON
| JSON | TypeScript |
|---|---|
"Ada" | string |
42, 3.14 | number |
true | boolean |
null accanto ad altri valori | una union come string | null |
"address": {"city": "Paris"} | una interface Address separata |
"users": [{"id": 1}] | User[] – il nome dell'elemento viene reso singolare |
| una chiave assente in alcuni elementi dell'array | una proprietà opzionale key?: |
[1, "a"] | (string | number)[] |
[] | unknown[] |
{} | Record<string, unknown> |
Esempio
Il JSON {"id": 1, "name": "Ada", "tags": ["admin"], "manager": null} diventa:
export interface Root { id: number; name: string; tags: string[]; manager: null; }
Rinomina Root con un nome significativo, come User o ApiResponse. Gli oggetti annidati con esattamente la stessa struttura – ad esempio un indirizzo di fatturazione e uno di spedizione – condividono un'unica interfaccia, e le chiavi che non sono identificatori validi vengono messe tra virgolette, ad es. "first-name": string.
Domande frequenti
Interface o type: quale scegliere?
Per descrivere oggetti si comportano allo stesso modo. Le interface possono essere estese e unite, mentre gli alias di tipo possono descrivere anche le union. Molti team usano le interface per gli oggetti; segui lo stile del tuo codice.
Come vengono rilevati i campi opzionali?
Gli oggetti all'interno dello stesso array vengono uniti. Una chiave assente in alcuni di essi diventa opzionale (key?:) e una chiave con valori di tipo diverso diventa una union.
Questo strumento valida i dati a runtime?
No. I tipi TypeScript scompaiono quando il codice viene eseguito. Per verificare i dati in ingresso, genera un JSON Schema dallo stesso esempio con il nostro generatore di JSON Schema e validali con una libreria per schemi.
Il mio JSON viene inviato a un server?
No. I tipi vengono generati nel tuo browser, quindi puoi incollare senza rischi anche risposte di API private.