JSON 转 TypeScript 类型定义生成器
粘贴 JSON 对象（或 JSON 数组），即可自动生成对应的 TypeScript interface/type 定义。
由 JSON 生成 TypeScript 类型定义
在 TypeScript 中接收 API 回应时，首先需要的就是类型定义。然而一边盯着层层嵌套的 JSON 一边手写 `interface` 既费神，**也正是最容易漏写属性或弄错类型的工作**。本工具只要贴上 JSON，即可自动生成对应的 `interface` 与 `type`。
生成时会依值在 JavaScript 上的类型来推断 TypeScript 的类型。**嵌套的对象会被抽出为另一个 interface**，数组则由元素的类型导出 `T[]`。根类型的名称可自由指定，因此产物可直接贴进项目。**由于推断完全基于您所贴上的样本，可能被省略的属性与可能为 null 的字段，请在生成后自行补上 `?` 或联合类型。** 所有处理都在浏览器中完成。
生成类型定义的步骤
- 贴上 JSON 把 API 的回应范例原样输入即可。对象或数组皆可。
- 决定根类型的名称 它会成为所生成最上层 interface 的名称，保留预设值也无妨。
- 查看生成结果 嵌套的对象会被抽出为独立的 interface 并列出。
- 自行补上可省略的字段 **样本中未出现的字段无法推断。** 请自行加上 `?` 与 `| null`。
- 复制后贴进项目 可直接贴入 `.ts` 文件。
用好本工具的小技巧
- 当数组中的所有元素都是对象时，会合并各元素的键生成一个 interface。部分元素缺失的键会自动标记为可选属性（`?`）。
- 根类型名称默认是 "Root"，可以修改为你喜欢的名称（例如 `User`、`ApiResponse`）。嵌套对象的 interface 名称会根据其所在的属性名自动生成。
- 直接粘贴 API 响应的示例 JSON，即可快速获得前端开发中所需类型定义的初稿。
- 生成的结果只是根据结构推断出的类型初稿。建议对照实际的 API 规范（是否可为 null、必填字段等）手动调整。
这些场景会用到
为外部 API 准备类型
即便 API 文档未提供类型定义，只要有回应范例便能做出起点。
为既有的 JSON 设定文件加上类型
想以类型安全的方式读取设定文件时，可把结构直接落成类型。
由模拟数据反推类型
先行开发前端时，可由暂用数据准备类型。
检验手写类型的疏漏
把手写的类型定义与生成的类型对照，即可找出遗漏之处。
TypeScript 的术语
- interface
- 描述对象形状的宣告。**同名多次宣告会自动合并**，这正是它与 type 的差别。
- type 别名
- 为任意类型命名的宣告。联合类型与基本类型也能被命名。
- 可省略属性
- 如 `name?: string` 这般带 `?` 的字段。**无法由所贴样本推断得出。**
- 联合类型
- 如 `string | null`，表示可为多种类型之一。
- 嵌套对象
- 值本身又是对象的结构。本工具会将其抽出为独立的 interface。
- 类型推断
- 由值导出类型。**此处的推断基于您所贴的单一样本，未必等同 API 的实际规格。**
常见问题
闲话 ― 类型推断工具解决的"类型偏差"问题
TypeScript 是一门可以在编译期借助静态类型发现 bug 的语言，但对于从外部 API 获取的 JSON 数据，如果开发者不手动定义类型，TypeScript 编译器是无从得知其结构的。每当 API 规范与实际响应出现偏差，或者字段被增删，都需要手动更新类型定义，这种"类型定义与 API 实际情况不一致"的问题一直困扰着许多前端项目。
JSON 转 TypeScript 工具通过从实际返回的示例 JSON 反向推算类型，大幅提升了这项工作的效率。同类工具中比较有名的是 quicktype（一个可以生成多种语言类型定义的开源工具），它以支持 JSON Schema、GraphQL schema 等多种输入格式而闻名。
类型推断的难点在于，JSON 本身并不包含"这个字段是否总是存在""未来是否可能变为 null"等信息。因此自动生成的类型定义并非万能，实践中的通行做法是将其视为仅反映"本次示例数据结构"的初稿，再对照实际的 API 规范进行调整。