当前位置：首页 > news >正文

TypeScript 中 Type 与 Interface 的区别详解

news 2026/7/2 9:35:04

TypeScript 中 Type 与 Interface 的区别详解

在 TypeScript开发中，type和interface是两种最常用的类型定义方式。它们都能用来描述对象的结构、函数签名等，但在实际使用中却有着微妙而重要的区别。很多初学者甚至有经验的开发者都容易混淆二者。本文将从四个方面深入解析type（类型别名）和interface（接口）的区别，帮助你更合理地选择使用场景。

1. 定义方式不同：类型别名 vs 接口

type是类型别名（Type Alias），它为一个已存在的类型创建一个新的名字。本质上，它只是对某个类型的“重命名”。
```
typePoint={x:number;y:number;};
```
interface是接口（Interface），它用于定义对象的结构契约，强调“这个对象应该长什么样”。
```
interfacePoint{x:number;y:number;}
```

虽然上面两个写法在功能上看起来一样，但它们的本质不同：type是对类型的引用或组合，而interface是对结构的声明。

2. 扩展方式不同

两者都支持扩展已有类型，但语法不同：

type使用交叉类型（&）进行扩展：

typeName={name:string};typeAge={age:number};typePerson=Name&Age;// 合并两个类型

interface使用extends关键字扩展：

interfaceName{name:string;}interfacePersonextendsName{age:number;}

此外，interface还支持多继承：

interfaceA{a:string;}interfaceB{b:number;}interfaceCextendsA,B{c:boolean;}

而type虽然也可以通过多个&实现类似效果，但可读性和语义不如interface清晰。

3. 表达能力不同：`type`更灵活

这是二者最关键的差异之一：

type可以为任意类型定义别名，包括：
- 基本类型（如string、number）
- 联合类型（Union Types）
- 元组类型（Tuple）
- 映射类型、条件类型等高级类型
示例：
```
typeID=string|number;// 联合类型typeCoord=[number,number];// 元组typePrimitive=string|boolean;// 基本类型别名
```

interface只能描述对象形状（object shape），不能表示基本类型、联合类型或元组：

// ❌ 错误！接口不能这样用interfaceID=string|number;// TS 报错interfaceCoord=[number,number];// TS 报错

因此，当你需要定义非对象结构的类型时，必须使用type。

4. 声明合并：接口自动合并，类型别名不会

这是interface独有的强大特性——声明合并（Declaration Merging）：

如果你在同一作用域中多次声明同名的interface，TS 会自动将它们合并成一个接口：
```
interfaceUser{name:string;}interfaceUser{age:number;}// 等价于：// interface User {// name: string;// age: number;// }
```
这一特性在扩展第三方库类型或模块增强时非常有用。

而type不允许重复定义：

typeUser={name:string;};typeUser={age:number;};// ❌ 错误：重复标识符 'User'

总结：如何选择？

特性	`type`	`interface`
定义对象结构	✅	✅
支持联合/元组/基本类型	✅	❌
扩展方式	`&`交叉类型	`extends`
声明合并	❌	✅
可读性与语义	更通用	更面向对象