256 Tools

JSON 转 TypeScript

TypeScript 输出
export interface Root {
  id: number;
  name: string;
  active: boolean;
  tags: string[];
  profile: Profile;
}

export interface Profile {
  age: number;
  city: string;
}
输出方式

相关外部工具

部分链接为联盟营销链接。

相关工具

一步将 JSON 转为 TypeScript 类型。粘贴 API 响应或任意 JSON 对象,即可立即获得整洁的 interface 或 type alias,嵌套对象、数组和可选字段均自动处理。完全在浏览器中运行,不上传任何数据。

使用方法

  1. 将 JSON 粘贴到输入框中。
  2. 设置根类型名称,选择 interface 或 type,以及 null 的处理方式。
  3. 将生成的 TypeScript 复制到您的项目中。

类型推断原理

每个对象生成独立的 interface,嵌套对象拥有各自命名的 interface。对象数组会合并为单一形状,部分条目中缺失的键会变为可选。null 值默认转为可空类型,也可选择转为可选属性。

JSON 被转换为 TypeScript interface 的示意图JSONinterface

功能特点

嵌套对象

深层嵌套的 JSON 会被拆分为相互引用的清晰独立 interface。

数组形状合并

对象数组合并为一个类型,条目间差异字段变为可选。

可选与可空字段

可选择 null 值生成可空类型还是可选属性。

interface 还是 type

根据代码库风格选择输出命名 interface 或 type alias。

自定义根名称

可为顶级类型命名为 User 或 ApiResponse 等任意名称。

常见用途

为 API 响应定义类型

粘贴示例响应,获取可在整个应用中使用的类型。

从 Mock 数据生成类型

从示例数据生成类型,让代码保持类型安全。

配置与数据文件

几秒内为 JSON 配置或内容文件创建类型。

学习 TypeScript

了解实际 JSON 如何映射为 TypeScript interface 和联合类型。

注意事项

  • 类型从您粘贴的示例中推断,请确保包含所有需要的字段。
  • 空数组因无法推断元素类型,会生成 unknown[]。
  • 在生产环境使用前,请仔细检查联合类型和可选字段。
  • 所有操作在您的设备上完成,不会发送到服务器。

常见问题

支持嵌套对象吗?
支持。每个嵌套对象生成独立的命名 interface,父级通过名称引用。
数组如何定义类型?
对象数组合并为单一 interface,部分条目中缺失的键变为可选。混合原始值数组生成联合类型,如 (string | number)[]。
null 值如何处理?
默认情况下,null 生成可空类型,也可切换为将 null 视为可选属性。
应该用 interface 还是 type?
两者均可,根据代码库风格选择。interface 常用于对象形状,type alias 更灵活,适合联合类型。
我的 JSON 会被上传吗?
不会。生成器完全在浏览器中运行,不会发送到服务器,也无需注册账号。

我们使用 Cookie 用于广告和分析。