JSON 转 TypeScript 类型

JSON 转 TypeScript 类型工具,粘贴 JSON 即时生成 interface 定义,嵌套对象与数组自动展开,可选择只输出接口,或附带类型守卫与解析代码。处理在浏览器本地完成,适合前端开发与接口联调。

在工作台中打开 本地处理 · 数据不上传

怎么使用

  1. 1

    粘贴 JSON

    粘贴接口返回的 JSON,对象生成 interface,数组按元素类型生成 T[]。

  2. 2

    修改根类型名

    默认 User,可改为业务语义名称(如 ApiResponse<UserInfo> 的内层模型)。

  3. 3

    复制类型定义

    勾选「仅类型」得到干净 interface,复制到 .ts 文件即可。

功能特点

精确联合类型

null 与具体类型共存时生成 string | null,混合字段生成联合类型而非 any。

嵌套结构展开

深层对象生成独立 interface 并按字段命名,类型之间自动引用。

可选接口模式

「仅类型」输出零依赖 interface;取消勾选附带类型守卫函数,适合直接做运行时校验。

本地零上传

接口响应、用户数据等敏感内容全部在浏览器内处理。

常见错误与排查

  • ! JSON 中为 null 的字段只能推断为 T | null(或 any),最好确认接口文档后手工改为具体类型。
  • ! 字段风格保持 JSON 原样(常用 snake_case 也会保留),与后端字段一致减少映射成本。
  • ! 生成的是静态类型而非运行时校验,需要防脏数据时请配合 Zod 等 schema 库。

常见问题

JSON 转 TypeScript 会生成 any 吗?

能确定类型的字段(string/number/boolean/数组/对象)都会给出具体类型;只有 null 单独出现、无法推断真实类型时才回退到 any,可在输出中搜索 any 重点确认。

数组里对象结构不一致怎么办?

工具会合并多条元素的字段,生成包含全部字段的 interface;若元素间字段类型冲突,则退化为联合类型(TypeScript 会用 | 表达)。

能生成 type 而不是 interface 吗?

当前输出 interface,二者在绝大多数场景可互换;如需 type 别名,把 interface X { 替换为 type X = { 即可。

相关工具