JSON转TypeScript工具:根据JSON自动生成TS接口
后端甩过来一个接口文档,返回的 JSON 嵌套了四五层,几十个字段。你要在 TypeScript 项目里对接,就得照着 JSON 一个字段一个字段手写 interface:这个是 string 还是 number?这层要不要单独抽个类型?字段可能为 null 怎么标?手写半小时,还难免抄错。
其实这一步完全可以自动化:把 JSON 贴进 JSON转TypeScript工具,interface 直接生成。
这个工具能做什么
- 自动推断字段类型:根据 JSON 里的实际值判断 string、number、boolean 等类型,不用自己逐个辨认。
- 处理嵌套对象:多层嵌套的 JSON 自动拆分成多个 interface,结构清晰,引用关系正确。
- 识别可空字段:值为 null 的字段自动标记为可空类型,减少运行时的类型报错。
- 转换全程在浏览器本地进行,接口数据不离开你的电脑,含敏感信息的返回体也能放心贴。
怎么用
- 打开 JSON转TypeScript工具。
- 把接口返回的 JSON 示例粘贴到左侧输入框。
- 右侧自动生成对应的 TypeScript interface 代码。
- 复制代码,粘贴到你的项目类型文件里,按需微调字段名和注释。
常见使用场景
对接后端 API:拿到接口返回示例后第一时间生成类型定义,配合请求库享受完整的类型提示和编译检查。
Mock 数据类型补全:项目里的 Mock JSON 文件补一份类型,前后端联调前前端就能安全开发。
旧项目 TypeScript 改造:把散落的 JSON 配置文件、接口响应逐个转成 interface,渐进式给 JS 项目加上类型。
小结
手写类型定义是前端最没技术含量的体力活之一。用 JSON转TypeScript工具 一键生成再人工微调,效率提升立竿见影,而且本地处理不担心数据外泄。提醒一句:工具根据单条样本推断类型,数组为空或字段缺失的情况记得手动补全。OhMyTools 上还有 JSON 格式化、JSON 与 CSV 互转等开发者工具,都在 OhMyTools。