JSON naar TypeScript

Gratis JSON naar TypeScript-converter. Genereer interfaces of typen vanuit JSON met geneste objecten, arrays en unies die automatisch worden afgeleid, kopieer het resultaat, geen aanmelding.

Gebouwd en onderhouden door Shehzad Munir ·

JSON naar TypeScript
Loading Loading JSON to TypeScript
Share

Getypte modellen op basis van echte gegevens

Converteer elke JSON onmiddellijk naar TypeScript-interfaces of -typen, waarbij geneste objecten, arrays, unies en optionele eigenschappen automatisch worden afgeleid.

Het met de hand schrijven van TypeScript-interfaces die overeenkomen met een API-antwoord is vervelend en foutgevoelig. Plak een JSON-payload en deze tool doorloopt de structuur en genereert een overeenkomende interface (of typealias) met correct getypte velden, geneste interfaces voor objecten en array-elementtypen. Gemengde arrays worden unietypen, zodat uw modellen de gegevens exact weerspiegelen.

Functies

  • Genereer interfaces of typ aliassen
  • Verwerkt geneste objecten en arrays
  • Leidt unietypen af ​​uit gemengde arrays
  • Optionele eigenschappen voor nullen
  • Aangepaste roottypenaam
  • Wordt lokaal uitgevoerd: code is nooit geüpload

Hoe JSON naar TypeScript te gebruiken

  1. 1

    Plak JSON

    Voeg een object of reeks gegevens toe.

  2. 2

    Opties instellen

    Kies interface of type, geef de root een naam, markeer nullables optioneel.

  3. 3

    Bekijk de typen

    Geneste interfaces worden automatisch gegenereerd.

  4. 4

    Kopiëren

    Kopieer het TypeScript naar uw project.

Veelvoorkomende gebruiksscenario's

  • Typ snel een API-antwoord
  • Genereer modellen vanuit een JSON-fixture
  • Maak interfaces voor een configuratiebestand
  • Bootstrap-typen voor een nieuwe integratie

Gedetailleerde gids

Stem de uitvoer af op uw stijl

Kies of u interfaces wilt uitzenden of aliassen wilt typen, geef het roottype een naam en markeer optioneel null-velden als optioneel. De gegenereerde code wordt live bijgewerkt en is klaar om in uw project te plakken. Het draait allemaal in uw browser, zodat privé-API-payloads en interne schema's uw machine nooit verlaten.

Hoe typen worden afgeleid

De converter leest uw JSON en wijst elke waarde toe aan een TypeScript-type: strings, getallen en booleans worden string, getal en boolean, geneste objecten worden hun eigen benoemde interfaces en arrays worden getypte arrays. Wanneer een array verschillende soorten waarden bevat, is het resultaat een unie zoals (string | number)[]. Een null-waarde wordt null, omdat het voorbeeld niet kan laten zien wat het veld bevat als het is ingesteld. Eigenschapsnamen die geen geldige ID's zijn, zoals 'voornaam', worden tussen aanhalingstekens geplaatst, zodat de uitvoer altijd wordt gecompileerd.

Nauwkeurige typen verkrijgen uit voorbeeldgegevens

Afgeleide typen zijn slechts zo goed als het monster. Als een veld ontbreekt in sommige API-antwoorden, markeer dit dan optioneel met ? na het genereren, en als een veld nul kan zijn in productie, verbreed het dan naar string | nul. Gebruik het meest volledige antwoord dat u kunt vinden, idealiter één waarin elk optioneel veld aanwezig is. Voor API's die u niet beheert, koppelt u de gegenereerde typen aan runtime-validatie, bijvoorbeeld Zod of io-ts, omdat TypeScript-typen tijdens runtime verdwijnen en een gewijzigde API niet kunnen opvangen. Datums komen in JSON aan als tekenreeksen, dus converteer ze zelf als u Date-objecten nodig heeft.

Veelgestelde vragen

Hoe converteer ik JSON naar een TypeScript-interface?

Plak uw JSON en de tool genereert onmiddellijk een overeenkomende interface, waardoor geneste interfaces voor objecten worden gemaakt en array-elementtypen worden afgeleid. Kopieer het rechtstreeks naar uw code.

Kan het geneste objecten en arrays verwerken?

Ja. Geneste objecten worden hun eigen benoemde interfaces en arrays worden getypeerd op basis van hun elementen. Arrays met gemengde typen produceren een unie zoals (string | number)[].

Kan ik typealiassen krijgen in plaats van interfaces?

Ja: schakel de optie in om 'type'-aliassen uit te zenden in plaats van 'interface'-declaraties, en hernoem het roottype zodat het bij uw project past.

Wordt mijn JSON ergens geüpload?

Nee. Het parseren en genereren gebeurt volledig in uw browser, zodat gevoelige payloads uw apparaat nooit verlaten.

Hoe genereer ik TypeScript-interfaces vanuit JSON?

Plak uw JSON (bijvoorbeeld een API-antwoord), geef de root een naam, en de tool leidt typen af ​​en produceert kant-en-klare interfaces, inclusief geneste objecten en arrays. Het draait lokaal, dus echte ladingen blijven privé.

Kan het geneste objecten en optionele eigenschappen verwerken?

Ja. Geneste structuren krijgen hun eigen benoemde interfaces, arrays krijgen elementtypen en je kunt velden als optioneel markeren, zodat de typen overeenkomen met echte, soms ontbrekende gegevens.

Kan ik een typealias uitvoeren in plaats van een interface?

Ja. Kies interface of type uitvoer, afhankelijk van de stijl van uw codebase; beide produceren nauwkeurige TypeScript op basis van de afgeleide JSON-vorm.

Uit het journaal

All articles →