Convertisseur JSON vers TypeScript

Collez une réponse d’API et obtenez des interfaces ou des alias de type TypeScript prêts à l’emploi, avec types imbriqués, champs optionnels et unions avec null déduits pour vous.

Fonctionne dans le navigateurSans inscriptionAucun envoi de données

TypeScript

Comment utiliser : JSON vers TypeScript

  1. Collez un exemple JSON, comme une réponse d’API, dans la zone de gauche ou ouvrez un fichier .json.
  2. Définissez le nom du type racine (par exemple User ou ApiResponse).
  3. Choisissez des déclarations interface ou type et activez export, readonly ou les champs tous optionnels.
  4. Choisissez unknown (plus sûr) ou any pour les valeurs que l’exemple ne permet pas de déduire, comme les tableaux vides et les null.
  5. Copiez le code généré ou téléchargez-le sous forme de fichier .ts.

Comment les types sont déduits

  • Primitifs : chaînes, nombres et booléens deviennent string, number et boolean.
  • Les objets imbriqués deviennent leurs propres interfaces nommées en PascalCase : billing_address devient BillingAddress.
  • Les tableaux d’objets sont fusionnés en un seul type d’élément, nommé au singulier : users donne User[]. Une clé absente de certains éléments devient optionnelle (key?:).
  • Les valeurs null se combinent avec les autres valeurs observées pour la clé : string | null. Une clé toujours null se rabat sur unknown ou any.
  • Les tableaux mixtes deviennent des tableaux d’union comme (number | string)[].
  • Les formes identiques sont déclarées une seule fois et réutilisées, et des formes différentes qui partageraient un nom reçoivent un suffixe numérique.
  • Les clés qui ne sont pas des identifiants valides, comme "first-name" ou "2fa", sont mises entre guillemets.

interface ou type

Pour de simples formes d’objets, les deux sont presque interchangeables. Les déclarations interface peuvent être étendues et fusionnées, et donnent des erreurs de compilation un peu plus claires. Les alias type peuvent aussi exprimer des unions et des mapped types. Beaucoup d’équipes utilisent des interfaces pour les modèles d’API et des types pour le reste ; choisissez ce qu’attend votre codebase ou votre linter (@typescript-eslint/consistent-type-definitions).

Obtenir de meilleurs types à partir de votre exemple

Les types ne peuvent être plus complets que l’exemple. Collez une réponse qui inclut les champs optionnels, ou un tableau avec plusieurs éléments variés, pour que le générateur détecte les clés optionnelles et nullables. Les dates et les enums arrivent sous forme de simples chaînes en JSON ; affinez-les ensuite à la main, par exemple status: 'active' | 'disabled'. Pour la validation à l’exécution, associez les types générés à une bibliothèque de schémas comme Zod.

Questions fréquentes

Mon JSON est-il envoyé quelque part ?
Non. Les types sont générés en JavaScript dans votre navigateur. Les réponses d’API contenant des tokens ou des données personnelles ne quittent jamais votre appareil.
Comment les propriétés optionnelles sont-elles détectées ?
Lorsque des objets d’un même tableau ont des clés différentes, les clés absentes d’au moins un objet sont marquées optionnelles avec ?. Avec un seul objet, toutes les clés sont obligatoires, sauf si vous cochez Tout optionnel.
Faut-il utiliser <code>unknown</code> ou <code>any</code> ?
unknown est plus sûr : TypeScript vous oblige à affiner la valeur avant de l’utiliser. any désactive la vérification de type pour cette valeur. Ne l’utilisez que si vous comptez affiner les types plus tard.
Pourquoi une date ISO est-elle typée <code>string</code> ?
JSON n’a pas de type date : les dates transitent sous forme de chaînes. Si vous les convertissez avec new Date() après l’analyse, changez la propriété en Date dans votre modèle.
Gère-t-il du JSON volumineux ou profondément imbriqué ?
Oui. La génération est linéaire en fonction de la taille de l’entrée et s’exécute localement : des réponses de plusieurs mégaoctets sont converties en bien moins d’une seconde.

Outils associés

Formateur JSON Formater, minifier et valider du JSON, erreurs à la ligne près. JSON Diff Comparer deux objets JSON et lister les changements par chemin. YAML vers JSON Convertir des configs YAML en JSON, multi-documents et erreurs précises. Convertisseur cURL Transformer des commandes curl en code fetch, Axios, Python, Go ou PHP.