
在 TypeScript 中interface和type都可以用来定义类型它们有很多相似之处但也存在一些关键区别。以下是它们的详细对比1. 基本语法interface (接口)interface User { name: string; age: number; }type (类型别名)type User { name: string; age: number; };2. 主要区别特性interfacetype扩展方式使用extends继承使用交叉类型合并声明支持声明合并不支持声明合并实现类可以被类实现 (implements)不能被类直接实现原始类型只能描述对象类型可以描述任意类型(原始值、联合类型等)元组可以描述但不太直观描述元组更直观性能检查速度稍快检查速度稍慢用interface 描述 TypeScript 元组3. 扩展/继承示例interface 扩展interface Person { name: string; } interface Employee extends Person { salary: number; }type 扩展type Person { name: string; }; type Employee Person { salary: number; };4. 声明合并 (interface 特有)interface User { name: string; } interface User { age: number; } // 最终 User 接口自动合并为: // { // name: string; // age: number; // }type 不支持这种合并重复定义会报错。5. 描述非对象类型 (type 优势)// 原始类型 type ID string | number; // 元组 type Point [number, number]; // 联合类型 type Status active | inactive; // 这些用 interface 无法直接实现6. 类实现 (interface 优势)interface Serializable { serialize(): string; } class JSONDocument implements Serializable { serialize() { return {}; } }type 虽然技术上也可以但不是设计初衷type Serializable { serialize(): string; }; class JSONDocument implements Serializable { serialize() { return {}; } }7. 使用建议使用 interface 当需要需要声明合并需要被类实现描述对象类型特别是面向对象设计时使用 type 当需要定义联合类型、交叉类型定义元组类型定义原始类型别名需要更灵活的类型操作8. 现代 TypeScript 实践在最新版本的 TypeScript 中两者的差异已经变得很小。团队可以根据偏好选择统一风格选择一种作为主要方式保持代码一致性混合使用用 interface 定义对象形状和类相关类型用 type 定义联合类型、复杂类型操作等个人偏好许多开发者现在更倾向于全部使用 type因为它更灵活9. 性能考虑对于大型代码库interface 检查速度稍快type 特别是复杂类型可能增加编译时间实际差异通常不大除非在极端情况下10. 何时不能互换当需要以下特性时必须使用 type// 条件类型 type NullableT T | null; // 映射类型 type ReadonlyT { readonly [P in keyof T]: T[P]; }; // 模板字面量类型 type EventNameT extends string ${T}Changed;11.type描述元组基础示例// 定义一个元组类型[姓名:string, 年龄:number] type PersonTuple [string, number]; // 使用 const tom: PersonTuple [Tom, 20]; // ✅ 取值 const name tom[0]; const age tom[1]; // ❌ 报错长度不对 // const jerry: PersonTuple [Jerry]; // ❌ 报错类型不对 // const jerry: PersonTuple [18, Jerry];可选元素元组元组里可以加可选?只能放在最后type User [string, number, boolean?]; const u1: User [张三, 25]; const u2: User [李四, 30, true];剩余元素展开语法type Message [string, ...number[]]; const msg1: Message [score, 90, 88, 76]; const msg2: Message [ok];只读元组readonly防止元组被 push、修改元素推荐type ReadonlyPoint readonly [number, number]; const p: ReadonlyPoint [10, 20]; // p[0] 99; // ❌ 报错只读不能修改 // p.push(30); // ❌ 报错带标签的元组Labeled TupleTS4给每个位置加名字可读性更强只是提示不影响运行时type Point [x: number, y: number]; const pt: Point [100, 200]; console.log(pt[0], pt[1]);对比普通数组区分重点type Arr (string | number)[]; // 普通数组长度任意 type Tp [string, number]; // 元组固定长度2位置类型固定 const a: Arr [a,1,2,b]; // ok const t: Tp [a,1]; // ok总结两者都是 TypeScript 强大的类型系统组成部分。理解它们的区别有助于编写更清晰的类型定义利用每种结构的优势避免潜在的限制在实际项目中选择主要取决于团队偏好和特定场景需求两者在大多数情况下可以互换使用。