🧩

JSON vers interface TypeScript

Collez un JSON pour générer automatiquement une interface TypeScript, avec objets imbriqués et tableaux

Remarque : les types sont déduits de ce JSON, il ne s'agit pas d'un JSON Schema. Lorsque les éléments d'un tableau ont des structures différentes, un type union est généré ; les noms de champs qui ne sont pas des identifiants valides sont mis entre guillemets.

Instructions

JSON 转 TypeScript 接口使用说明



功能简介


拿到一份接口返回的 JSON,要手写 TypeScript 类型很费时间。这个工具直接读 JSON 结构,递归推断出嵌套的 interface。

使用方法


  • 把 JSON 粘贴到输入框,点「填入示例」可以先看一个复杂例子

  • 填好根接口名(默认 Root),选 `interface` 或 `type` 别名

  • 如果字段可能缺失,勾上「字段可选」给每个字段加 `?`

  • 点「生成 TypeScript」,结果按引用顺序输出,子类型在前、根类型在后

  • 点「复制结果」复制走


  • 注意事项


  • 类型是从这一份 JSON 推断出来的:字段为 `null` 时只会得到 `null`,缺字段也看不出来。要更准确请用多份样本或手写补充

  • 数组里元素结构不一致时会生成联合类型,例如 `(A | B)[]`

  • 空数组只能推断出 `unknown[]`,需要你自己补类型

  • 字段名不是合法标识符时会用引号包起来,符合 TypeScript 语法
  • ❓ FAQ

    Que faire si les objets d'un tableau ont des types différents ?

    L'outil génère une interface pour chaque structure distincte et écrit le type des éléments du tableau sous forme d'union, par exemple `(User | Admin)[]`, que vous pouvez affiner ensuite selon votre métier.

    Pourquoi un champ null a-t-il le type null ?

    Avec cette seule donnée, impossible de savoir s'il deviendra une chaîne ou un nombre. Complétez avec tous les types rencontrés dans les données réelles, ou remplacez manuellement par `string | null`.

    L'outil génère-t-il des types Go ou Java ?

    Seul TypeScript est généré pour l'instant. Pour visualiser la structure, les noms d'interfaces imbriquées déduits ici se transposent facilement en structures d'un autre langage.

    📝 Articles connexes

    tool-tutorials

    Comment utiliser un générateur d'expressions Cron : guide complet pour débutants

    Utilisez un outil en ligne pour sélectionner les cinq champs temporels, générez automatiquement une expression Cron standard avec une explication temporelle compréhensible, et apprenez à diagnostiquer les décalages d'exécution dus au fuseau horaire et au nombre de champs, sans plus deviner pour les cycles complexes.

    tool-tutorials

    Comment utiliser un outil en ligne de conversion CSV vers JSON : trois étapes pour les débutants

    Réalisez en trois étapes une conversion CSV vers JSON avec un outil en ligne, couvrant la configuration des options, la vérification du résultat, la résolution d'erreurs, le traitement de gros fichiers, l'utilisation sur mobile et le débogage d'interface ; les débutants peuvent suivre ces étapes pour obtenir des données JSON utilisables.

    tool-tutorials

    Qu'est-ce que le formatage HTML ? Les points essentiels pour les débutants

    Utilisez un outil de formatage HTML exécuté localement dans le navigateur pour restaurer un HTML minifié ou désordonné en une structure lisible et indentée, et clarifiez la différence entre formatage et minification, l'ordre de diagnostic d'une indentation chaotique, ainsi que les solutions face à un gros fichier bloqué et au formatage mobile sans installation.

    tool-tutorials

    Différence entre le formatage/compression JS et l'organisation manuelle du code : lequel choisir

    La différence entre le formatage/compactage JS et l'arrangement manuel réside dans le compromis entre automatisation et jugement humain. Le formatage/compactage traite les lots selon des règles, rapidement et de manière cohérente ; l'arrangement manuel est plus flexible, adapté aux conventions de nommage spécifiques ou aux logiques complexes. Pour le développement et le débogage quotidiens, privilégiez les outils et réservez le travail manuel aux parties nécessitant vraiment un jugement. Comprendre ce que signifie le formatage/compactage JS vous aide à savoir quand l'utiliser et quand vous arrêter.