TypeScript中interface与type的核心区别与适用场景详解

作者：木棉时间：2026-10-31 18:37:01浏览：639

本文深入解析TypeScript中interface和type关键字的区别。从语法定义、声明合并机制、继承与扩展方式（extends与交叉类型）、类型兼容性检查策略，到访问修饰符支持、联合/交叉类型处理、类实现约束、映射类型支持及泛型参数位置等12个维度进行对比。通过具体代码示例，明确两者在函数签名、构造函数定义及实际开发中的最佳实践，帮助开发者根据场景选择合适类型定义方式。

解读TypeScript中interface和type的用法及区别

在TypeScript中，interface和type都是用于定义自定义类型的关键字，它们在语法、功能及适用场景上存在显著差异（欢迎补充更多区别）

1. 语法差异

interface使用关键字interface进行定义，例如：interface Person { name: string; }
type使用关键字type进行定义，例如：type Person = { name: string; }

2. 声明合并（Merging）的能力

interface具有声明合并能力，允许定义多个同名接口，系统会自动合并其成员定义，从而实现接口的扩展
type不具备声明合并能力，若多次定义同名类型，编译器将报错

3. 可扩展性

interface可以使用extends关键字继承其他接口，实现接口的复用与扩展
type无法使用extends关键字，但可通过交叉类型（Intersection Types）实现类型的复用与扩展

4. 兼容性

interface在类型兼容性检查时执行“兼容性递归检查”，只要目标类型包含源类型的所有成员，即视为兼容
type不进行“兼容性递归检查”，仅当类型精确匹配时才被视为兼容

5. 类型注解和类型别名

interface可用于定义函数类型、类类型等复杂类型的注解
type可用于定义任意类型的别名，从而简化复杂类型的书写

6. 访问修饰符

interface可在属性和方法上使用public、private和protected等访问修饰符
type不能指定访问修饰符，其所有成员默认为公共（public）

7. 联合类型与交叉类型

type支持使用联合类型（Union Types）和交叉类型（Intersection Types）组合多个类型
interface不直接支持联合类型和交叉类型的语法，但可通过继承和声明合并实现类似效果

8. 实现接口和类型别名

interface可被类通过implements关键字实现，以强制约束类的结构
type不能被类直接实现，更适合作为类型别名以简化复杂类型的定义

9. 映射类型

type支持使用映射类型，根据已有类型动态生成新类型
interface不支持映射类型

type Options<T> = {
  [K in keyof T]: boolean;
};

interface PersonOptions {
  name: boolean;
  age: boolean;
}

// 使用映射类型
type Result = Options<PersonOptions>;
// Result 的类型为 { name: boolean, age: boolean }

// 不能使用映射类型
// interface ResultInterface extends Options<PersonOptions> {}

10. 范型参数位置

在泛型参数位置上，type可出现在任意位置，且可交叉和联合多个类型
在泛型参数位置上，interface只能出现在类型别名的右侧

type Tuple = [number, string];

type NumberArray = Array<number>;

type Union = number | string;

// 有效的定义
type MyType<T> = { value: T };
type MyType2 = MyType<number>;

// 有效的定义
interface MyInterface<T> {
  value: T;
}
type MyInterface2 = MyInterface<number>;

// 无效的定义
// interface MyInterface<T> {
//   value: T;
// }
// interface MyInterface2 extends MyInterface<number> {}

11. 扩展对象类型

interface可通过声明合并方式扩展已有对象类型，从而添加新属性或方法
type需使用交叉类型来实现对象类型的扩展

interface Person {
  name: string;
}

interface ExtendedPerson extends Person {
  age: number;
}

// 使用声明合并进行扩展
const person: ExtendedPerson = {
  name: 'John',
  age: 25,
};

type Person = {
  name: string;
};

type ExtendedPerson = Person & {
  age: number;
};

// 使用交叉类型进行扩展
const person: ExtendedPerson = {
  name: 'John',
  age: 25,
};

12. 调用签名和构造函数

interface可定义调用签名以描述函数类型，也可定义构造函数签名以描述类的构造函数
type可通过函数类型和构造函数类型别名来描述函数类型和类的构造函数

interface Greeting {
  (name: string): string;
}

interface Person {
  new (name: string): Person;
  name: string;
  sayHello(): void;
}

// 定义调用签名和构造函数签名
const greeting: Greeting = (name) => `Hello, ${name}!`;

class PersonClass implements Person {
  constructor(public name: string) {}
  sayHello() {
    console.log(`Hello, my name is ${this.name}.`);
  }
}

type Greeting = (name: string) => string;

type Person = {
  new (name: string): Person;
  name: string;
  sayHello(): void;
};

// 使用类型别名
const greeting: Greeting = (name) => `Hello, ${name}!`;

class PersonClass implements Person {
  constructor(public name: string) {}
  sayHello() {
    console.log(`Hello, my name is ${this.name}.`);
  }
}