JSON naar TypeScript
Zet een JSON-object om in getypeerde TypeScript-interfaces.
- Direct
- Gratis
- Privé (lokaal verwerkt)
- Zonder registratie
Een API-respons in seconden typeren
In plaats van de interfaces van een grote JSON met de hand te schrijven, plak je hem hier. De tool leidt types recursief af: geneste objecten omgezet naar aparte interfaces, getypeerde arrays, optionele velden gemarkeerd met een “?”.
-
Plak de JSON
Een API-respons, een configbestand, elk object.
-
Noem de root
“Root” standaard, of de naam van je keuze.
-
Kopieer de interfaces
Klaar om in je .ts-bestand te plakken.
Voorbeeld van inferentie
| JSON-waarde | Afgeleid type |
|---|---|
| "name": "Ada" | name: string |
| "age": 36 | age: number |
| "roles": ["admin"] | roles: string[] |
| "profile": { … } | profile: Profile |
| (sleutel ontbreekt in een array-object) | veld?: type |
Inferentie uit één voorbeeld: vergeet niet null te verfijnen (vaak tot een union string | null) en de types achteraf te controleren. Alles gebeurt lokaal, je JSON verlaat de browser nooit.
Veelgestelde vragen
Hoe worden de types afgeleid?
De tool onderzoekt elke waarde: een getal wordt number, een string string, een boolean boolean. Objecten worden interfaces met de naam van hun sleutel, en arrays worden getypeerd op hun elementen (string[], MijnType[]…).
Hoe worden optionele velden gedetecteerd?
Wanneer een array meerdere objecten bevat, voegt de tool hun sleutels samen. Een sleutel die in sommige maar niet alle objecten voorkomt, wordt optioneel gemarkeerd met “?”. Dat is precies het verwachte gedrag voor heterogene API-data.
Wat gebeurt er met null-waarden of lege arrays?
Een null-waarde wordt getypeerd als null (handmatig te verfijnen, vaak tot een union als string | null). Een lege array wordt unknown[], omdat het elementtype niet uit één voorbeeld te bepalen is.
Is het resultaat klaar om in mijn code te plakken?
Ja: de root-interface krijgt de naam van je keuze (“Root” standaard), sub-interfaces staan erboven, en de syntaxis is geldige TypeScript. Hernoem de interfaces naar je domein voor duidelijkheid.