JSON to TypeScript
Understand JSON to TypeScript
Ce générateur lit un échantillon de JSON et écrit les interfaces TypeScript qui en décrivent la forme.
How it works
Il parcourt l'échantillon et déduit un type pour chaque clé à partir de la valeur qu'il y trouve : une chaîne devient string, un nombre devient number, un objet imbriqué devient sa propre interface nommée, et un tableau devient le type de l'élément suivi de []. L'inférence n'a qu'un seul exemple sur lequel travailler, si bien que la sortie décrit cet exemple avec précision — c'est un premier jet que vous modifiez, pas un type dérivé d'un contrat.
When to use it
- Typer la réponse d'une API tierce qui ne publie aucun type.
- Transformer une charge utile enregistrée ou une donnée de test en interfaces.
- Obtenir un premier jet d'une grande réponse imbriquée au lieu de la saisir à la main.
- Voir la forme réelle d'une réponse, y compris des champs que la documentation ne mentionne jamais.
Watch out for
- Un champ facultatif qui se trouve absent de l'échantillon ressort comme obligatoire, et un champ présent mais null n'apprend rien au générateur sur son type réel. Collez un échantillon qui inclut les cas gênants, puis marquez vous-même les champs facultatifs.
- Tout nombre devient number. TypeScript n'a pas de type entier, si bien que la distinction entre un identifiant et un prix se perd — et un identifiant au-delà de 2^53 avait déjà perdu en précision au moment de l'analyse du JSON, avant même que le générateur ne le voie.
- Un champ dont le type varie d'une réponse à l'autre — tantôt une chaîne, tantôt null, tantôt un objet — est typé d'après la version que vous avez collée. L'interface générée compile, puis se révèle fausse à l'exécution.
Not the right tool for: Remplacer un schéma. Si l'API publie un document OpenAPI ou JSON Schema, générez les types à partir de celui-ci — il décrit toutes les réponses plutôt qu'une seule.
Frequently Asked Questions
Comment convertir du JSON en interface TypeScript ?
Collez une réponse JSON représentative et nommez l'interface racine. Les types apparaissent au fil de la frappe : les objets imbriqués deviennent leurs propres interfaces nommées, les tableaux sont typés d'après leurs éléments, et le résultat est prêt à être collé dans un fichier .ts ou téléchargé.
Comment les propriétés facultatives sont-elles détectées ?
À partir d'un tableau d'objets, toute clé absente d'au moins un élément est marquée facultative par un point d'interrogation. C'est pourquoi coller plusieurs enregistrements représentatifs produit de meilleurs types qu'en coller un seul — le générateur ne voit que ce que l'échantillon lui montre.
Que deviennent les valeurs null ?
Un null est typé null plutôt que deviné, si bien qu'une clé vue tantôt comme un nombre, tantôt comme null devient number | null. Activez « Les null deviennent facultatifs » si votre API utilise null pour signifier « absent », et la clé devient facultative à la place.
How to Use JSON to TypeScript
- Paste or type your input in the input area above.
- The tool processes your input automatically or click Run.
- Copy or download the result using the action buttons.
- Use Ctrl+Enter to run quickly from the keyboard.