interface和type被TS设计出来，是完全不同的东西，有各自的职责。

  • interface用来定义对象类型，可以对对象的形状进行描述。
  • type用来给类型起一个新的别名。它并不是一个类型，只是一个别名。类型别名可以让TS编写更简洁清晰。

相同点

都可以用来描述对象或函数。

  1. type Point = {
  2.   x: number;
  3.   y: number;
  4. };
  6. type SetPoint = (x: number, y: number) => void;
  1. interface Point {
  2.   x: number;
  3.   y: number;
  4. }
  6. interface SetPoint {
  7.   (x: number, y: number): void;
  8. }

都支持扩展。

  1. type Animal = {
  2.   name: string;
  3. };
  5. type Bear = Animal & {
  6.   honey: boolean;
  7. };
  1. type Animal = {
  2.   name: string;
  3. };
  5. interface Bear extends Animal {
  6.   honey: boolean;
  7. }
  1. interface Animal {
  2.   name: string;
  3. }
  5. interface Bear extends Animal {
  6.   honey: boolean;
  7. }
  1. interface Animal {
  2.   name: string;
  3. }
  5. type Bear = Animal & {
  6.   honey: boolean;
  7. };

不同点

类型别名可以为基本类型、联合类型、元组定义别名，接口不行。

  1. type Num = number;
  2. type ID = string | number;
  3. type Point = [number, number];

同名接口会自动合并，而类型别名不会。

  1. interface User {
  2.   name: string;
  3. }
  5. interface User {
  6.   age: number;
  7. }
  9. let user: User = {
  10.   name: "zhang",
  11.   age: 18,
  12. };
  1. type User =  {
  2.   name: string;
  3. }
  5. // 报错，标识符User重复
  6. type User = {
  7.   age: number;
  8. }

适用场景

接口适用场景

  • 定义基本数据类型的别名
  • 定义元组类型
  • 定义函数类型
  • 定义联合类型
  • 定义映射类型

类型别名适用场景

  • 定义对象类型（包括属性、方法）
  • 利用接口合并特性时