Vai al contenuto

JSON in TypeScript

Da JSON a TypeScript converte localmente esempi JSON in interfacce TypeScript e alias di tipo, con campi opzionali, inferenza union/null/date, nome root e copia/download in .ts.

JSON

Caratteri

0 / 50,000

TypeScript

JSON in TypeScript

Avvio rapido

1
Incolla un campione JSON valido nell’editor sinistro.
2
Se serve, imposta un nome root come ApiResponse.
3
Controlla TypeScript a destra: oggetti -> interface; array o primitive -> type alias.
4
Copia o scarica il .ts generato; il pannello input gestisce anche il campione JSON.

Scenari comuni

Trasformare rapidamente risposte API reali in tipi TypeScript pronti per frontend, SDK o attività di integrazione.

Prima di fissare il contratto, osservare con un esempio JSON come vengono inferiti campi opzionali, null e union.

Converti dati JSON fittizi in definizioni di tipo rapide per fixture, storie Storybook o prototipi.

Quando cambia la risposta backend, usare un nuovo esempio JSON per capire se tipi annidati come User o Meta vanno aggiornati.

Consigli d'uso

Utilizzare un campione JSON rappresentativo. Si tratta di un'inferenza basata su campioni, pertanto i campi o i valori mancanti non possono essere visualizzati nell'output.
Gli array vuoti diventano unknown[] e gli oggetti vuoti diventano interface che estendono Record<string, unknown> finché non fornisci dati di esempio più ricchi.
Le dichiarazioni annidate vengono normalizzate dai nomi proprietà, quindi l'output più recente preferisce nomi come User o Meta invece delle vecchie forme con prefisso root.
La generazione funziona solo con JSON valido. Correggi prima gli errori di sintassi; l'editor mostra riga e colonna quando il parsing fallisce.
I nomi root personalizzati validi vengono mantenuti così come sono; i nomi non validi vengono normalizzati in un identificatore PascalCase TypeScript valido.

Tipo Confini di inferenza

Il generatore deduce dal campione corrente, non da schema JSON, Open API, GraphQL, file, URL, linee JSON o campioni batch.
Le matrici uniscono le forme degli elementi osservati: i campi mancanti da alcuni elementi diventano facoltativi e i valori nulli o misti diventano unioni.
Le stringhe simili a date possono essere dedotte come Date, ma il valore JSON di runtime è ancora una stringa a meno che il codice non lo analizzi.
Le radici degli oggetti generano l'interfaccia; gli array e le radici primitive generano alias di tipo; gli array vuoti utilizzano Unknown[] e gli oggetti vuoti estendono Record<string, Unknown>.
Il nome root predefinito è Root. I nomi personalizzati legali vengono conservati, mentre i nomi non validi e le parole riservate vengono normalizzati inPascalCase.
L'output è costituito solo da dichiarazioni TypeScript statiche: nessun validatore di runtime, parser, serializzatore, schema Zod/Yup/io-ts o client API.

Limitazioni e compatibilità

Questo strumento deduce i tipi da dati campione, non da uno schema formale o da una fonte di verità contrattuale. I campi mancanti nel tuo campione non possono essere indovinati.
L'input deve essere JSON rigoroso. Commenti, virgole finali e altre sintassi solo JavaScript vengono rifiutati.
Il codice TypeScript generato non include istruzioni di esportazione. Il download di un file .ts è separato dall'aggiunta della parola chiave di esportazione che il tuo progetto potrebbe richiedere.
Il risultato è solo codice statico TypeScript. Non crea validatori di runtime, parser, serializzatori, schemi Zod o client API.

Privacy e sicurezza

JSON in TypeScript viene eseguito localmente nel browser. L’input JSON può restare come bozza del browser. Se è attivo uno spazio di lavoro salvato o la sincronizzazione WebDAV, l’input JSON, il nome del tipo radice, le preferenze dei numeri di riga di input/output e le preferenze di a capo possono essere salvati tramite quella sincronizzazione. Il TypeScript generato, gli errori di convalida, le evidenziazioni riga/colonna, lo stato di copia e la cronologia di annullamento derivano dall’input corrente e non vengono salvati come dati di risultato separati. I download del JSON di input e dell’output .ts vengono creati solo quando fai clic su Download. Questo strumento non carica file e non crea allegati.

Domande frequenti

6

Continua con questi strumenti correlati per il passaggio successivo.

Tutta l'elaborazione degli strumenti avviene localmente nel tuo browser.