在 TypeScript 里定义对象类型时，很多人会纠结用 type 还是 interface。比如定义一个用户对象，两种写法都可以：

// 使用 interface
interface User {
  name: string;
  avatar: string;
  level: number;
}

// 使用 type
type User = {
  name: string;
  avatar: string;
  level: number;
};

这两种写法效果差不多，但实际用起来有不少区别。下面我们来详细看看。

1. 继承方式不同

interface 用 extends 实现继承：

interface UserBasic extends User {
  email: string;
}

type 用 & 实现类型合并：

type UserBasic = {
  email: string;
} & User;

看起来结果一样，但 interface 的继承更接近传统面向对象的概念。另外，interface 不能直接继承基本类型（比如 string），但 type 可以：

type S = string & number & {}; // 没问题

2. 扩展方式不同

interface 支持声明合并。如果你多次定义同名的 interface，TypeScript 会把它们合并在一起：

interface User {
  email: string;
}

interface User {
  phone: number;
}

// 最终 User 包含 email 和 phone

这个特性在扩展第三方库类型时特别有用。比如给数组加一个自定义方法：

interface Array<T> {
  last(): T | undefined;
}

Array.prototype.last = function() {
  return this[this.length - 1];
};

type 不允许重复定义同名类型，会直接报错。

3. 类实现方面

两种方式都可以被类实现：

// 用 interface
interface IUser {
  name?: string;
  age: number;
  isAdult(): boolean;
}

class User implements IUser {
  age = 16;
  isAdult() {
    return this.age >= 18;
  }
}

// 用 type
type IUser = {
  name?: string;
  age: number;
  isAdult(): boolean;
}

class User implements IUser {
  age = 16;
  isAdult() {
    return this.age >= 18;
  }
}

在这方面，两者没有区别。

4. 功能范围不同

type 其实是为类型起别名，可以定义各种类型：

• 基本类型别名：type ID = string;

• 联合类型：type Status = 'pending' | 'success' | 'error';

• 元组类型：type Point = [number, number];

• 函数类型：type ClickHandler = (event: MouseEvent) => void;

interface 主要用来定义对象类型，是更“标准”的对象类型定义方式。

5. 开发体验差异

在编辑器中，把鼠标放在 type 定义的类型上时，会直接显示详细结构。而 interface 通常只显示名称，需要点击查看详情。这个小区别有时会影响开发效率。

如何选择？

根据上面的比较，可以得出以下建议：

• 如果需要声明合并（比如扩展第三方类型），只能用 interface

• 如果需要定义联合类型、元组等复杂类型，只能用 type

• 定义对象类型时，两者都可以，但有一些偏好：

• 面向对象编程，尤其是类实现时，优先考虑 interface

• 简单的对象类型，根据团队习惯选择

• 需要更清晰的类型提示时，可以考虑 type

实际项目中的建议

对于新手，可以这样开始：

1. 定义对象类型时，先默认用 interface

2. 遇到 interface 做不到的情况时（比如需要联合类型），换用 type

3. 团队统一规范，保持代码一致性

对于有经验的团队，可以制定更详细的规则，比如：

• 公共 api 用 interface，方便扩展

• 内部使用的复杂类型用 type

• 简单的交叉类型用 type

记住，TypeScript 官方也表示，未来两种方式的差异可能会进一步缩小。所以不需要过度纠结，保持一致性更重要。

总结

type 和 interface 在 TypeScript 中各有优势。interface 更适合传统的面向对象编程，支持声明合并；type 更灵活，能定义各种复杂类型。在实际项目中，根据具体需求选择，保持团队统一规范即可。随着 TypeScript 版本更新，两者的功能会越来越接近，掌握核心区别就能做出正确选择。

本文内容仅供个人学习/研究/参考使用，不构成任何决策建议或专业指导。分享/转载时请标明原文来源，同时请勿将内容用于商业售卖、虚假宣传等非学习用途哦～感谢您的理解与支持！

链接: https://fly63.com/article/detial/13105