Slik bruker du det
- Lim inn JSON i inntastingsfeltet, åpne en .json-fil, eller prøv eksempelet.
- Angi navnet på rottypen, for eksempel Order eller ApiResponse.
- Velg interface- eller typedeklarasjoner, og om du vil legge til export og readonly.
- Kopier den genererte TypeScript-koden eller last den ned som types.ts.
Slik fungerer det
Generatoren går gjennom hele JSON-dokumentet og registrerer hvilke verdityper som finnes på hvert sted. Hvert JSON-objekt blir sin egen navngitte deklarasjon. Navnet kommer fra egenskapsnøkkelen skrevet i PascalCase, slik at «shipping_address» blir ShippingAddress. Elementer i en array navngis etter entallsformen av nøkkelen: «items» gir Item, «categories» gir Category, og nøkler som ikke ser ut som flertallsformer får suffikset «Item».
Alle objekter i én array slås sammen til ett interface. Hvis en nøkkel bare finnes i noen av dem, markeres den som valgfri med «?». Hvis en verdi har forskjellige typer på forskjellige steder, blir typen en union, for eksempel string | number. null beholdes som egen type, slik at et felt som noen ganger er null, blir string | null. En tom array blir unknown[], fordi det ikke er noe å utlede fra. To objekter med nøyaktig de samme egenskapene og typene deler ett interface i stedet for å opprette duplikater. Nøkler som ikke er gyldige identifikatorer, for eksempel «first-name», settes i anførselstegn.
Resultatet beskriver bare eksempelet du limer inn. Et felt som i virkeligheten er valgfritt eller kan være null, blir obligatorisk og ikke-null hvis ikke eksempelet ditt viser det, og datoer kommer som vanlige strenger. Sjekk typene mot API-dokumentasjonen din før du stoler på dem.
Eksempler
Typifisering av et API-svar
Lim inn en ordre fra butikk-API-et ditt med rotnavnet Order. Du får interface-ene Order, Customer, Item og Shipping, med note?: string på Item fordi bare ett av de to elementene har en note.
Skrivebeskyttet konfigurasjon
Lim inn en config.json, kryss av for «Gjør egenskaper skrivebeskyttet» og lim resultatet inn i config.d.ts, slik at utilsiktede skrivinger til konfigurasjonen fanges opp av kompilatoren.
Array på toppnivå
Et liste-endepunkt returnerer [{…}, {…}]. Med rotnavnet Product starter resultatet med «export type Product = ProductItem[];» etterfulgt av ProductItem-interfacet.
Ofte stilte spørsmål
Hvorfor er et felt valgfritt i resultatet?
Fordi minst ett objekt i samme array ikke har den nøkkelen. Hvis alle objekter har den, er den obligatorisk. Lim inn flere poster for å få mer nøyaktige valgfrie felt.
Hvorfor blir en dato typet som streng?
JSON har ingen datotype, så datoer sendes som strenger. Generatoren gjetter ikke formater. Endre typen selv hvis koden din konverterer dem til Date-objekter.
Hva er forskjellen mellom interface og type?
For objektskjemaer fungerer de nesten likt. Interfaces kan utvides og slås sammen ved senere deklarasjoner; type-aliaser kan ikke gjenåpnes. Velg stilen kodebasen din allerede bruker.
Kan den generere kjøretidsvalidering som Zod-skjemaer?
Nei. Den produserer bare TypeScript-deklarasjoner, som sjekkes ved kompilering og ikke validerer data under kjøring.
Personvern
JSON-en din analyseres bare i nettleseren din. Ingenting lastes opp, lagres eller inkluderes i analyseverktøy.