jsonecho

JSON vers TypeScript

Collez un exemple JSON et obtenez des types TypeScript pour lui.

Chargement de l'outil...

Comment utiliser JSON vers TypeScript

  1. Collez un exemple JSON représentatif, idéalement un avec tous les champs optionnels remplis.
  2. Définissez le nom du type racine, et décidez si vous voulez aussi du code auxiliaire ou uniquement les types.
  3. Copiez le code TypeScript généré dans votre projet.

À propos de JSON vers TypeScript

Écrire des classes de modèle à la main pour une grosse charge utile JSON est fastidieux, et c'est là que les fautes de frappe s'installent. Collez un exemple ici et le générateur déduit la structure : quels champs existent, lesquels sont des objets, lesquels sont des tableaux et quel type a chaque valeur. La sortie est des interfaces pour chaque objet. Décochez « Types uniquement » et une classe Convert avec vérifications à l'exécution est ajoutée.

Une interface n'existe qu'à la compilation. Si vous devez vérifier les données entrantes à l'exécution, gardez la classe Convert. Tout s'exécute dans votre navigateur, donc vos données d'exemple restent sur votre machine.

Utiliser le code généré

Castez avec const data: Root = JSON.parse(text), ou utilisez la Convert.toRoot(text) générée pour la validation.

Les propriétés optionnelles sont écrites avec un point d'interrogation, et les nullables comme string | null.

Questions fréquentes

De quoi dépend le code TypeScript généré ?

La sortie est des interfaces pour chaque objet. Décochez « Types uniquement » et une classe Convert avec vérifications à l'exécution est ajoutée.

Comment analyser du JSON avec le résultat ?

Castez avec const data: Root = JSON.parse(text), ou utilisez la Convert.toRoot(text) générée pour la validation.

Comment les champs optionnels et manquants sont-ils gérés ?

Les propriétés optionnelles sont écrites avec un point d'interrogation, et les nullables comme string | null.

Le générateur regarde-t-il plus d'un enregistrement ?

Il ne connaît que ce qui est dans votre exemple. Si un champ manque dans votre exemple, il n'apparaîtra pas dans les types, et si une valeur est null dans votre exemple, son type est inconnu. Collez un exemple dans lequel autant de champs que possible sont remplis, ou collez un tableau avec plusieurs enregistrements différents.

Mon JSON est-il envoyé à un serveur ?

Non. Le générateur est téléchargé dans votre navigateur la première fois que vous l'utilisez, environ 1 Mo, et tout s'exécute localement.

Plus dans Données vers classe

Tous les outils →