跳到内容
DevLab

JSON → TypeScript Interface 生成器

粘贴 JSON 自动生成 TypeScript interface。嵌套拆分、数组 union 推断、null / readonly 选项。

完全免费 无需注册 浏览器内完成 即刻下载 5 种语言 深色模式
⬇ types.ts 

            
        

    






    
📖 常见的坑


        
本工具会从 JSON 样本构建 TypeScript 的 interface，全部处理在浏览器内完成。需要牢记的是：它只能描述你所粘贴样本中出现的形状。可选字段、可能为 null 的值、由多种类型组成的联合类型，若样本中没有实例，就会被当作不存在。

    
        

        

            
                

                    情形
                    会发生什么
                    怎么处理
                

            
            
                                

                    存在值为 null 的字段
                    若样本中只出现 "deletedAt": null，就无从判断该字段本应是什么类型。结果会是 null 或 any，而一旦真的传来日期字符串，这个类型就成了谎言。
                    最可靠的做法是粘贴由多条真实数据合并而成的样本。若做不到，请在生成后手工改为 deletedAt: string | null。开启 strictNullChecks 后，漏改的地方编译器会提醒你。
                

                                

                    数组为空或只有一个元素
                    从 [] 无法推断元素类型，只会得到 never[] 或 any[]。只有一个元素同样危险：那一条恰好缺少的字段，会直接从类型中消失。
                    请在数组中放入2~3 个性质不同的元素：一个含可选字段、一个不含、一个取值达到最大长度。随后别忘了给真正可选的属性加上 ?。
                

                                

                    把生成的类型当作权威定义
                    样本只是实现的一次观测，并非规格本身。API 日后新增字段时，你的类型不会随之更新；反过来，只是「这次恰好没出现」的属性也可能就此缺失并被带上线。
                    若存在 OpenAPI 或 JSON Schema，请以其为唯一权威并据此生成类型。在整理 schema 时可借助 JSON Schema 校验器与 OpenAPI 转 curl。若是完全没有 schema 的第三方 API，请在数据到达的边界立即校验（zod、valibot 等），以免类型与实际数据的偏差在生产环境才首次暴露。
                

                            
        

    

    
        
JSON 中的数字都会变成 number，但 JavaScript 的 number 无法精确保存超过 253-1（9,007,199,254,740,991）的整数。返回 int64 ID 的 API 会悄悄丢失位数，指向另一条记录。请与服务端约定以字符串返回 ID，或用 bigint 接收。日期同理："2026-07-26T00:00:00Z" 只能是 string，因此请先决定在哪一层转换为 Date，之后就不必再回头改类型。

    









    
📖 使用方法

    
    
                
  1. 
            1
            
    
                
    粘贴 JSON
    
                
    单个对象或数组皆可
    
            
    
        
    2. 
                
  2. 
            2
            
    
                
    调整选项
    
                
    interface / type / null / readonly
    
            
    
        
    3. 
                
  3. 
            3
            
    
                
    复制或下载 .ts
    
                
    直接粘贴到代码中
    
            
    
        
    4. 
            






    
❓ 常见问题

    

                

            
                数组中类型混合？
                
            
            
分析所有元素 -> union 类型

        

                

            
                null 与 undefined？
                
            
            
JSON 无 undefined。开启: field?: T，关闭: field: T | null

        

                

            
                日期 / 自定义类型？
                
            
            
在 JSON 中都是 string -> 后续手动改写

        

            







    

        
            🐛 此工具出现问题了吗？
            
        

        

            免费、无需注册。仅提供复现步骤也有帮助。报告将直接发送给运营者并用于改进。
        


        

                        

            

                
                
            


            

                
                
                

                    ※ 为复现问题,浏览器信息 (UA / 屏幕 / 语言 / URL) 将自动发送