Skip to content
JSON vers TypeScript
Tools

JSON vers TypeScript

Nouveau

Générez des interfaces TypeScript à partir d’un échantillon JSON, avec types imbriqués.

Output

Runs entirely in your browser. Nothing is uploaded.

Convertissez JSON en TypeScript en un clic

Ce convertisseur JSON vers TypeScript génère des interfaces, types ou classes prêts à l'emploi à partir d'un échantillon JSON, pour ne plus jamais avoir à écrire manuellement un type pour une réponse d'API. Collez un payload à gauche et un TypeScript propre et correctement indenté apparaît immédiatement à droite — copiez-le ou téléchargez-le en tant que fichier .ts.

C'est une alternative rapide, gratuite et sans inscription : une seule étape JSON vers interface TypeScript qui s'exécute entièrement dans votre navigateur, avec les objets imbriqués, tableaux et unions tous déduits automatiquement. Pas de limite de taille de fichier, pas de quota d'utilisation quotidien et rien ne quitte jamais votre appareil.

Interfaces, types ou classes — votre choix

Utilisez le sélecteur de sortie pour basculer entre une interface, un alias de type, ou une class. Le mode interface est le mode par défaut et émet export interface Root { … } ; le mode type produit export type Root = { … } pour les bases de code qui préfèrent les alias ; et le mode class déclare les champs dans un export class. Le même JSON alimente les trois, donc vous pouvez les comparer avec vos propres données en quelques secondes.

Vous pouvez renommer la racine, activer ou désactiver le mot-clé export, et le choix est mémorisé pour la prochaine fois — transformant ceci en un générateur de types TypeScript flexible plutôt qu'un convertisseur à format unique.

Inférence intelligente pour les objets imbriqués, tableaux et unions

Le moteur parcourt votre JSON et construit une interface nommée pour chaque objet, nommant les interfaces imbriquées d'après leurs clés et singularisant les éléments de tableau — un tableau orders devient Order[]. Les formes identiques sont dédupliquées en une seule interface, et les tableaux de types mixtes se réduisent en une union comme (string | number)[].

Activez la détection d'enums et les valeurs de chaîne répétées sont déduites comme une union littérale — une colonne de statut avec "envoyé" et "en attente" devient "en attente" | "envoyé" au lieu d'un string générique. Cette précision donne à la sortie un aspect écrit à la main.

Champs optionnels, nuls et en lecture seule bien gérés

Les vraies données d'API sont imparfaites, alors le convertisseur les traite honnêtement. Lorsque vous convertissez une réponse d'API en TypeScript, les clés qui n'apparaissent que dans certains éléments d'un tableau sont marquées optionnelles avec ?, et vous décidez comment les nulls sont typés : conservez-les comme une union explicite | null, ou activez null → optionnel pour transformer zip: string | null en zip?: string.

Un sélecteur readonly préfixe chaque propriété avec le modificateur readonly pour les modèles immuables. Ensemble, ces options vous permettent de correspondre à la rigueur de votre projet plutôt que de lutter contre les types TypeScript générés depuis JSON.

Comparaison avec quicktype, json2ts et MakeTypes

quicktype.io est l'option la plus complète pour la génération multi-langages — il cible Python, Go, C#, Kotlin et bien d'autres langages en plus de TypeScript. Cette polyvalence signifie que sa sortie TypeScript inclut parfois des helpers d'exécution et du code supplémentaire. Il traite également votre JSON sur ses serveurs, ce qui est important pour les payloads confidentiels. json2ts.com est plus simple et génère des interfaces basiques mais manque de détection d'enums, de support readonly et des options de gestion des nulls.

MakeTypes génère des classes TypeScript avec du parsing en temps d'exécution. Ce convertisseur UtiloKit génère des types purs sans empreinte d'exécution — juste les interfaces ou alias de type dont votre code a besoin, fonctionnant entièrement dans votre navigateur sans envoi vers un serveur et sans compte.

Privé par conception — votre JSON ne quitte jamais le navigateur

Chaque conversion s'effectue localement en utilisant JavaScript dans votre onglet. Votre JSON n'est jamais envoyé à un serveur, stocké ou partagé — il fonctionne hors ligne et est sûr pour les payloads confidentiels, les API internes et les données de production. Ajoutez ce convertisseur JSON vers TypeScript à vos favoris et utilisez-le chaque fois que vous avez besoin de types rapidement.

L'analyseur tolérant accepte même les entrées JSON-ish avec des // commentaires, des virgules finales et des chaînes avec guillemets simples, donc vous pouvez coller un objet littéral JavaScript depuis votre éditeur et obtenir une sortie valide. Aucune autre étape n'est nécessaire.

Frequently asked questions

Comment convertir du JSON en TypeScript ?

Collez votre JSON dans le panneau d'entrée (ou cliquez sur Exemple pour charger un exemple) et le TypeScript correspondant apparaît instantanément dans le panneau de sortie. Par exemple, {"id": 1, "nom": "Sophie"} devient export interface Root { id: number; nom: string; }. Cliquez sur Copier ou Télécharger .ts pour ajouter les types directement à votre projet.

Comment générer une interface TypeScript à partir de JSON ?

Laissez la sortie configurée sur Interface (par défaut) et chaque objet JSON devient son propre export interface. Configurez le champ Nom racine pour contrôler le nom du niveau supérieur. Par exemple { "id": 1, "nom": "Sophie" } avec un nom racine de Utilisateur produit export interface Utilisateur { id: number; nom: string; }. Les objets imbriqués sont automatiquement transformés en leurs propres interfaces nommées.

Quelle est la différence entre une interface et un alias de type ?

Les deux décrivent la même forme d'objet — choisissez celui que préfère votre base de code en utilisant le sélecteur Interface / Type / Class. Le mode Interface émet export interface Root { … }, qui peut être rouvert et étendu avec la fusion de déclarations ; le mode Type émet export type Root = { … }, qui peut aussi exprimer des unions et des primitifs ; le mode Class émet export class Root { … } avec des champs déclarés.

Comment gérer les champs optionnels ou nuls (? / | null) ?

Deux sélecteurs contrôlent cela. 'Optionnel (?) pour les clés manquantes' marque comme optionnel tout attribut absent dans certains éléments d'un tableau d'objets. 'null → optionnel' réécrit un champ nullable comme zip: string | null en zip?: string ; désactivez-le pour conserver l'union explicite | null. Combinez-les pour correspondre au style de gestion des nulls de votre équipe.

Est-il sûr de coller du JSON ici ?

Oui. La conversion est 100% côté client : votre JSON est analysé et transformé en TypeScript par du JavaScript s'exécutant dans votre propre onglet de navigateur, et n'est jamais envoyé, enregistré ou transmis à un serveur. Vous pouvez vous déconnecter d'internet et l'outil continue de fonctionner.

Comment fonctionne la détection d'enums de chaîne ?

Activez 'Détecter les enums de chaîne' et une colonne de chaînes répétées comme 'envoyé' et 'en attente' est déduite comme une union littérale "en attente" | "envoyé" au lieu d'un simple string. Cela rend les types générés beaucoup plus précis et utiles.

Puis-je générer des types à partir d'une réponse d'API ou Swagger ?

Oui — collez une vraie réponse JSON de votre API et l'outil déduit des interfaces prêtes à l'emploi que vous pouvez connecter directement à vos appels fetch ou axios pour l'autocomplétion et la sûreté des types. Pour un endpoint Swagger/OpenAPI, copiez un corps de réponse d'exemple (le JSON, pas le document de schéma) et convertissez-le.