TypeScript接口

接口定义

在TypeScript里，接口的作用就是为这些类型命名和为你的代码或第三方代码定义契约。
interface关键字，接口中属性是可以配置可选的，属性名字定义的后面加一个?符号

interface IPerson{
    firstName: string
    lastName?: string   // 可选属性
}
function fun(p: IPerson) {
    console.log(p.firstName)
}
fun({firstName: '诸葛', lastName: '孔明'})

只读属性

在属性名字的前面加一个readonly修饰，只有新创建时可以修改

interface IPerson{
    readonly firstName: string
    lastName?: string
}
const p: IPerson = {
    firstName: '诸葛'
}
p.firstName = '东方' // 报错

给接口定义索引签名

interface IPerson{
    readonly firstName: string
    lastName?: string
    [propsName:string]: any  // 索引签名,解决添加属性报错问题
}
const p: IPerson = {
    firstName: '诸葛',
    age: 18 // 未添加索引签名，会报错
}

定义函数类型接口

接口能够描述JavaScript中对象拥有的各种各样的外形。 除了描述带有属性的普通对象外，接口也可以描述函数类型。
它就像是一个只有参数列表和返回值类型的函数定义。参数列表里的每个参数都需要名字和类型

interface IPerson{
    (firstNam:string, lastName:string): string
}
// 函数中的参数名，可以不需要和接口中定义的名称一致
let personAllName: IPerson = function(first:string, last:string):string {
    return `${first}_${last}`
}
console.log(personAllName('东方','不败')) // 东方_不败

可索引的类型接口

可索引类型具有一个 索引签名，它描述了对象索引的类型，还有相应的索引返回值类型

interface IPerson{
    [propsName:number]:string
    // [propsName:string]:string
}
let p: IPerson = ['东方不败', '诸葛孔明']
console.log(p[0])

// let p2: IPerson = {'fistName': '东方'}
// console.log(p2.fistName)

类类型

实现接口

使用implements，类中要包含接口中的属性，并且实现接口中的方法

interface IPerson{
    name: string
    say(str:string):string
}
class Person implements IPerson {
    name: string
    say(str:string){
        return str
    }
    constructor(name:string) {
        this.name = name
    }
}
let p = new Person('东方不败')
console.log(p.say('大家好'))

继承接口

使用extends 一个接口可以继承多个接口

interface A{
    name: string
}
interface B{
    age:number
}
interface C{
    address:string
}

interface D extends A,B,C{
    say(str:string):void
}
let d = <D>{name:'东方不败',age:12,say(str:string){console.log(str)}}
console.log(d.name)
d.say('hello')

接口继承类

它会继承类的成员但不包括其实现

class B{
    age:number
    constructor(age:number){
        this.age = age
    }
}
interface A extends B{
    name: string
}

class C implements A {
    name: string  
    age: number // 必须包含A接口继承B类中的age属性
    constructor(age:number,name:string){
        this.name = name
        this.age = age
    }
}