2023-02-17 type 和 interface 的异同点

相同点:
  • 都可以定义一个对象或者函数
  • 都可以继承
不同点:
  • interface 是 TS 设计出来定义对象类型的,可以对对象的形状进行描述 ,遵循 OOP 的继承关系
  • type 是类型别名,用于给类型定义别名,类似于 object.assign
  • type 可以声明基本类型、联合类型、交叉类型、元组、interface 不行
  • interface 可以合并重复声明,type 不行
  • interface 继承不能添加相同的参数,type 可以
  • interface 使用 extends 实现继承, type 使用交叉类型实现继承
  • interface侧重于描述数据结构,type侧重于描述类型

定义函数
// type定义函数

type Fn = (x: number, y: string) => boolean;
// interface 定义函数
interface Fn2 {
    (x: number, y: string): boolean;
}
都能实现继承
interface Person {
    name: string
}

type Person1 = {
    name: string
}

// interface继承interface
interface S extends Person {
    age: number
}

// 交叉类型 (type继承type)
type S1 = Person1 & {
    age: number
}

// interface继承type
interface S2 extends Person1 {
    age: number
}

// type 继承 interface
type S3 = Person & {
    age: number
}

const styden: S = {
    name: '花花',
    age: 18
}
继承添加相同属性
interface Person{
    name:string
}


// interface继承
interface Son extends Person{
    name:number
}

Error:
Interface 'Son' incorrectly extends interface 'Person'.
Types of property 'name' are incompatible.
Type 'number' is not assignable to type 'string'.
interface Person{
    name:string
}

// type继承不报错
type Son = Person & {
    name:number
}
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容