JSON 转 TypeScript
将 JSON 数据自动转换为 TypeScript 接口或类型定义
JSON 输入
行数: 1 | 字符: 0
TypeScript 输出
// 输入 JSON 后自动生成 TypeScript 类型定义类型: 0 | 行数: 1
什么是 JSON 转 TypeScript?
JSON 转 TypeScript 是将 JSON 数据自动转换为 TypeScript 类型定义的工具。它分析 JSON 结构,生成对应的 interface 或 type 声明,帮助开发者在 TypeScript 项目中获得类型安全和代码提示。
使用方法
- 在左侧输入框粘贴 JSON 数据,或点击示例按钮加载示例
- 配置选项:设置根类型名称、选择 interface/type 风格、是否添加 export 等
- 右侧自动生成对应的 TypeScript 类型定义
- 点击「复制」按钮复制生成的类型定义到剪贴板
- 将类型定义粘贴到 TypeScript 项目中使用
使用实例
简单对象转换
输入 JSON:
{
"name": "张三",
"age": 28,
"isActive": true
}
输出 TypeScript:
export interface Root {
name: string;
age: number;
isActive: boolean;
}嵌套对象转换
输入 JSON:
{
"user": {
"id": 1,
"profile": {
"avatar": "url",
"bio": "简介"
}
}
}
输出 TypeScript:
export interface UserProfile {
avatar: string;
bio: string;
}
export interface User {
id: number;
profile: UserProfile;
}
export interface Root {
user: User;
}常见问题 (FAQ)
Q: 生成类型后如何使用?
A: 将生成的类型定义复制到 .ts 文件中,然后在代码中使用。例如:const data: Root = JSON.parse(response)
Q: interface 和 type 有什么区别?
A: interface 可以被扩展和实现,适合定义对象类型;type 更灵活,可以定义联合类型、交叉类型等。对于简单对象结构,两者功能相似。
Q: 如何处理数组类型的 JSON?
A: 工具会自动识别数组元素类型。如果是对象数组,会为数组元素生成单独的类型定义,然后使用 ItemType[] 表示数组。
Q: 生成的类型是否可以编辑?
A: 生成后可以自由编辑。建议根据实际需求调整类型名称、添加可选字段标记(?)、或修改部分字段的类型定义。