TypeScript 之 interface 和 type 区别

108 阅读1分钟

type 和 interface 类似,都用来定义类型,但 type 和 interface 区别如下:

区别1:定义类型的范围不同

interface 只能定义对象类型或接口当名字的函数类型。

type 可以定义任何类型,包括基础类型、联合类型、交叉类型、元组。

// type 定义基础类型
type num = number

// type 定义联合类型例子1:
type baseType = string | number | symbol

// type 定义联合类型例子2:
interface Car {brandNo: string}
interface Plane {No: string; brandNo: string}
type typVechile = Car | Plane

// 元组
interface Car {brandNo: string}
interface Plane {No: string; brandNo: string}
type typVechile = [Car, Plane]

区别2:接口可以 extends (继承) 一个或多个接口或类实现一个或多个接口,也可以继承type,但type类型没有继承功能。一般接口继承类或type的应用场景很少见。

区别3:type 交叉类型 & 可让类型中的成员合并成一个新的type类型,但接口不能交叉合并。


type Group = {groupName: string, memberNum: number}
type GroupInfoLog = {info: string, happen: string}
type GroupMember = Group & GroupInfoLog // type 交叉类型合并

let data: GroupMember = {groupName: '001', memberNum: 10, info: '集体爬山', happen: '中途有组员差点滑落,有惊无险'};

区别4:接口可以合并声明

定义两个相同名称的接口会合并声明,定义两个同名的type会出现编译错误。

interface Error {
  name: string
}

interface Error {
  message: string;
  stack?: string;
}

// 接口合并
let error: Error = {
  message: 'error',
  name: 'NullPointException',
}