NL

JSON naar TypeScript omzetten

Om JSON naar TypeScript om te zetten plak je hieronder voorbeeldgegevens: de tool maakt interfaces of types met geneste objecten, arrays en optionele velden – of een JSON Schema. Je gegevens blijven in de browser.

Bron: TypeScript Handbook – Object Types (interfaces, optional properties, readonly). Bijgewerkt: .

Mijn toolbox

Resultaat

Resultaat
export interface Root { id: number; name: string; email: null; tags: string[]; address: Address; orders: Order[]; active: boolean; } export interface Address { street: string; zip: string; } export interface Order { no: number; total: number; voucher?: string; }
Samenvatting
3 types gemaakt uit 217 tekens JSON.
Alleen wat in de voorbeeldgegevens staat wordt afgeleid: een veld dat daar nooit null was, wordt niet als nullable herkend; velden die niet in elk object voorkomen worden optioneel (?).

Zo wordt het berekend

JSON naar TypeScript omzetten betekent: uit voorbeeldgegevens de passende types afleiden. {"id": 1, "name": "Anna"} wordt een interface met id: number en name: string. De tool leest je JSON in je browser, voegt objecten van dezelfde soort samen en schrijft de types als broncode – zonder upload.

Zo werkt het

  1. Plak JSON in het veld, bijvoorbeeld een API-antwoord.
  2. Kies de uitvoer: interfaces, types (type) of JSON Schema. Stel namen, export, readonly en inspringing naar wens in.
  3. Kopieer het resultaat en plak het in je project.

Hoe de types ontstaan

Beperkingen

Het resultaat is een concept: controleer het aan de hand van de documentatie van de interface, want voorbeeldgegevens tonen niet elk mogelijk geval.

Privacy

De JSON verlaat je browser niet. Verder: JSON formatteren, CSV naar JSON of YAML naar JSON.

Veelgestelde vragen

Hoe zet ik JSON om naar TypeScript?

Plak de JSON en kies “TypeScript-interfaces”: de tool maakt interfaces met alle velden, geneste types en arrays. Kopieer ze naar je project.

Interface of type – wat is beter?

Beide beschrijven dezelfde vorm. Interfaces zijn uit te breiden en geven vaak betere foutmeldingen; type is flexibeler bij unions. De tool maakt op verzoek allebei.

Hoe herkent de tool optionele velden?

Een veld dat in het ene object ontbreekt maar in het andere voorkomt, krijgt een vraagteken. Daarvoor worden meerdere objecten in een array samengevoegd.

Kan ik ook een JSON Schema genereren?

Ja, kies “JSON Schema (2020-12)”. Het schema bevat types, geneste eigenschappen en de lijst van verplichte velden.

Wordt mijn JSON geüpload?

Nee. De types ontstaan helemaal in je browser.

Bronnen en wettelijke basis

Bijgewerkt op: · Redactioneel beleid

Vergelijkbare tools