Tarayıcınız güncel değil

Bu siteyi görüntülemek için tarayıcınızın veya cihazınızın işletim sisteminin güncellenmesi gerekiyor.

Your browser is out of date. Please update iOS or your browser to view this site.

Zum Hauptinhalt springen
Gizke.com
Blog

JSON zu TypeScript

Läuft auf Ihrem Gerät. Nichts wird gesendet.
Deklarieren als

TypeScript

JSON einfügen, um die TypeScript-Typen zu sehen.

JSON einfügen und TypeScript-Interfaces oder -Types erhalten - verschachtelte Objekte benannt, Arrays zusammengeführt, optionale Keys und Unions erkannt.

Fügen Sie eine API-Antwort, eine Konfigurationsdatei oder ein beliebiges JSON-Beispiel ein und erhalten Sie TypeScript-Deklarationen für Ihren Code. Jedes verschachtelte Objekt wird ein eigenes benanntes Interface, Arrays von Objekten werden zusammengeführt - Keys, die in manchen Einträgen fehlen, werden optional, unterschiedliche Werte werden Unions - und gleich aufgebaute Objekte teilen sich eine Deklaration. Wählen Sie interface oder type, export, readonly und die Schreibweise optionaler Keys, dann kopieren oder als .ts herunterladen.

Häufige Fragen

Wie werden verschachtelte Typen benannt?
Nach dem Key, unter dem sie stehen, in PascalCase: ein address-Objekt wird Address, die Einträge eines users-Arrays werden User. Bekämen zwei verschiedene Formen denselben Namen, erhält die zweite eine Zahl (Item2).
Warum ist ein Feld optional oder eine Union?
In Arrays wird jeder Eintrag verglichen. Ein Key, der in manchen Einträgen fehlt, wird optional; ein Key mit Zahl in einem und Text im anderen Eintrag wird string | number. Für gute Typen ein repräsentatives Beispiel verwenden.
Was ist mit Datumswerten, Enums und leeren Arrays?
JSON kennt keinen Datumstyp, Daten bleiben string; feste Wertemengen ebenfalls - grenzen Sie sie von Hand ein. Ein leeres Array wird unknown[], weil nichts abzuleiten ist.
Wird mein JSON hochgeladen?
Nein. Parsen und Erzeugen passieren im Browser, private API-Daten und Tokens im Beispiel bleiben auf Ihrem Gerät.

Dieses Tool teilen

BlogÜber unsKontaktNutzungsbedingungenDatenschutzerklärung