Ga naar inhoud
TextArray
100% lokaal

JSON naar TypeScript

Genereer TypeScript-interfaces vanuit een JSON-document, met geneste objecten als benoemde subinterfaces.

Invoer
Uitvoer

JSON naar TypeScript

Plak een JSON-document (een API-antwoord, een configuratiebestand, een databaserij) en ontvang kant-en-klare TypeScript-declaraties. Typen worden recursief afgeleid: primitieven worden toegewezen aan string, number en boolean, arrays dragen hun elementtype, en gemengde arrays worden schone unies zoals (number | string)[]. Elk genest object wordt een benoemde subinterface die is afgeleid van de eigenschapssleutel in PascalCase, dus een eigenschap "user" produceert een gebruikersinterface die u overal kunt importeren en waarnaar u kunt verwijzen.

Identieke vormen worden gedetecteerd en hergebruiken een enkele interface in plaats van duplicaten te genereren; een numeriek achtervoegsel verschijnt alleen als twee objecten dezelfde sleutelnaam delen, maar qua structuur verschillen. Lege arrays verschijnen als onbekend[] en lege objecten als Record<string, onbekend> - eerlijke tijdelijke aanduidingen in plaats van gissingen. Eigenschapsnamen die geen geldige identificatiegegevens zijn, worden automatisch tussen aanhalingstekens geplaatst, zodat de hoofdletters en numerieke toetsen intact blijven.

De opties omvatten echte projectconventies. Geef het roottype een naam, kies tussen interface- en typedeclaraties, exporteer alles of niets, markeer alle eigenschappen als alleen-lezen en beslis hoe null-waarden worden behandeld - als een expliciet null-type of als optionele eigenschappen. Ongeldige JSON produceert een rustige fout met de regel en kolom van het probleem, op dezelfde manier waarop de JSON-formatter dit rapporteert.

Alles draait lokaal in uw browser: API-reacties met tokens, gebruikersrecords of interne payloads verlaten uw machine nooit. Plak, kopieer de declaraties naar uw codebase en de vorm van uw gegevens wordt getypt.

FAQ

Hoe worden geneste objecten en arrays getypeerd?
Geneste objecten worden benoemde subinterfaces die zijn afgeleid van hun eigenschapssleutel in PascalCase. Arrays nemen hun elementtype; wanneer elementen verschillen, is het type een unie zoals (nummer | string)[]. Een reeks objecten met dezelfde vorm gebruikt één interface voor alle elementen.
Wat gebeurt er met twee voorwerpen met dezelfde vorm?
Ze delen één interface: de generator vergelijkt structuren en gebruikt de voornaam opnieuw. Een numeriek achtervoegsel zoals Item2 verschijnt alleen als twee eigenschappen dezelfde sleutel hebben, maar echt verschillende vormen hebben.
Hoe worden nulwaarden afgehandeld?
Standaard wordt een null-eigenschap als null getypt, wat precies is wat het voorbeeld zegt. Schakel "Optionele eigenschappen voor null-waarden" in om prop?: onbekend uit te zenden - handig wanneer null "soms afwezig" betekent in uw API.
Waarom wordt mijn lege array getypt als onbekend[]?
Een lege array bevat geen bewijs van het elementtype, dus onbekend [] is het eerlijke antwoord. Voeg één representatief element toe aan het monster en de generator leidt het werkelijke type af.
Wordt mijn JSON ergens geüpload?
Nee. De tool draait volledig in uw browser en uw gegevens verlaten uw apparaat nooit – veilig voor API-reacties die tokens of persoonlijke gegevens bevatten.