Zum Inhalt springen
TextArray
100% lokal

JSON zu TypeScript

Erzeuge TypeScript-Interfaces aus einem JSON-Dokument — verschachtelte Objekte werden benannte Sub-Interfaces.

Eingabe
Ausgabe

JSON zu TypeScript

Füge ein JSON-Dokument ein — eine API-Antwort, eine Konfigurationsdatei, einen Datenbankeintrag — und erhalte fertige TypeScript-Deklarationen. Typen werden rekursiv abgeleitet: Primitive werden zu string, number und boolean, Arrays tragen ihren Elementtyp, und gemischte Arrays werden zu sauberen Unions wie (number | string)[]. Jedes verschachtelte Objekt wird ein benanntes Sub-Interface, abgeleitet aus seinem Property-Schlüssel in PascalCase — eine "user"-Property erzeugt also ein User-Interface, das du überall importieren und referenzieren kannst.

Identische Strukturen werden erkannt und teilen sich ein einziges Interface, statt Duplikate zu erzeugen; ein numerisches Suffix erscheint nur, wenn zwei Objekte denselben Schlüsselnamen tragen, sich aber strukturell unterscheiden. Leere Arrays werden zu unknown[], leere Objekte zu Record<string, unknown> — ehrliche Platzhalter statt Raterei. Property-Namen, die keine gültigen Bezeichner sind, werden automatisch in Anführungszeichen gesetzt, sodass Kebab-Case- und numerische Schlüssel unversehrt bleiben.

Die Optionen decken echte Projektkonventionen ab. Benenne den Wurzeltyp, wähle zwischen interface- und type-Deklarationen, exportiere alles oder nichts, markiere Properties als readonly und entscheide, wie null-Werte behandelt werden — als expliziter null-Typ oder als optionale Properties. Ungültiges JSON erzeugt eine ruhige Fehlermeldung mit Zeile und Spalte des Problems, genau wie beim JSON-Formatierer.

Alles läuft lokal in deinem Browser: API-Antworten mit Tokens, Nutzerdaten oder internen Payloads verlassen deinen Rechner nie. Einfügen, Deklarationen in die Codebasis kopieren — und die Form deiner Daten ist typisiert.

Häufige Fragen

Wie werden verschachtelte Objekte und Arrays typisiert?
Verschachtelte Objekte werden benannte Sub-Interfaces, abgeleitet aus ihrem Property-Schlüssel in PascalCase. Arrays übernehmen ihren Elementtyp; unterscheiden sich die Elemente, entsteht eine Union wie (number | string)[]. Ein Array gleichgeformter Objekte nutzt ein Interface für alle Elemente.
Was passiert bei zwei Objekten mit gleicher Struktur?
Sie teilen sich ein Interface — der Generator vergleicht Strukturen und verwendet den ersten Namen wieder. Ein numerisches Suffix wie Item2 erscheint nur, wenn zwei Properties denselben Schlüssel, aber wirklich unterschiedliche Strukturen haben.
Wie werden null-Werte behandelt?
Standardmäßig wird eine null-Property als null typisiert — genau das, was die Probe aussagt. Mit „Optionale Eigenschaften für null-Werte" entsteht stattdessen prop?: unknown — nützlich, wenn null in deiner API „manchmal nicht vorhanden" bedeutet.
Warum wird mein leeres Array als unknown[] typisiert?
Ein leeres Array liefert keinen Hinweis auf seinen Elementtyp, also ist unknown[] die ehrliche Antwort. Ergänze ein repräsentatives Element in der Probe und der Generator leitet den echten Typ ab.
Wird mein JSON irgendwo hochgeladen?
Nein. Das Tool läuft vollständig in deinem Browser und deine Daten verlassen dein Gerät nie — sicher auch für API-Antworten mit Tokens oder persönlichen Daten.