TS interface

什么是接口，如何使用

答：

接口是一系列抽象方法的声明，是一些方法特征的集合，这些方法都应该是抽象的，需要由具体的类去实现，然后第三方就可以通过这组抽象方法调用，让具体的类执行具体的方法。

一个接口所描述的是一个对象相关的属性和方法，但并不提供具体创建此对象实例的方法。

设置只读属性、函数属性

interface User {
  name: string
  age?: number
  readonly isMale: boolean
  say: (words: string) => string
}

给接口添加字符串索引签名

如果你想让使用者自定义索引名：

interface User {
  name: string
  age: number
  [propName: string]: any
}

类型断言

interface User {
  name: string
  age: number
}

const getUserName = (user: User) => user.name
getUserName({ color: 'yellow' } as User)

接口可以继承，多个父类用逗号隔开

interface Father {
  color: string
}

interface Mother {
  height: number
}

interface Son extends Father, Mother {
  name: string
  age: number
}

来源整理自：vue3js.cn 面试官系列