TypeScript-接口

Posted 2021-09-15 Liane

TypeScript的核心原则之一是对值所具有的结构进行类型检查。
一、对象类型接口
TS使用接口来定义对象的类型。
接口（interface）：是对象的状态(属性)和行为(方法)的抽象(描述)。
实例：需求是创建一个Person的对象，需要对该对象进行一定的约束:
1、id是number类型，必须有，只读
2、name是string类型，必须有
3、age是number类型，必须有
4、gender是string类型，可没有
语法：使用interface关键字，接口名一般加上大写的i

interface 接口名{
    属性名:值类型         //必须包含该属性
    readonly 属性名:值类型 //该属性必有且只读
    属性名?:值类型        //该属性可有可无
    方法名:(形参:类型) => 返回值类型
}

//定义一个接口，包含以上规则
interface IPerson{
    readonly id: number //readonly-该属性为只读
    name: string
    age: number
    gender?: string //?-该属性可有可无
    sayHi:(str:string)=>viod  //无返回值的方法
    run:(d:number)=>number  //返回值为number类型
}
//定义一个对象，该对象的类型是接口IPerson
let p1: IPerson = {
    id: 1,
    name: \'Liane\',
    age: 18,
    gender: \'female\',
    sayHi(str:string):void{
        console.log(`Hi,My name is ${this.name}`)
    },
    run(d:number):number{
        return ++d
    }
}

二、函数类型接口
将接口作为函数的类型，用来约束函数的参数列表和返回值类型等。
语法：

interface 接口名 {
    (形参名:值类型,形参名:值类型):返回值类型
}

//定义一个函数类型的接口
interface SearchFunc{
    (source: string,subString: string):boolean
}
//定义一个函数，类型为SearchFunc
let mySearch:SearchFunc = function(a:string,b:string):boolean{//形参名不必须跟接口一致
    return a.search(b) > -1
}
console.log(mySearch(\'Liane\',\'a\'))

三、类类型接口
使用接口作为类的类型。
语法：

interface 接口名{
    方法名() //该方法没有任何的实现
}

使用时:

class 类名 implements 接口名{
    /*类里面必须包含接口中的属性和方法*/
}

//定义一个类的接口IFly
interface IFly{
    fly()
}
//定义一个类，类型为IFly
class Bird implements IFly{
    fly(){
        return \'I can fly\'
    }
}
let b1 = new Bird()
console.log(b1.fly()) 

一个类可以实现多个接口

//一个类实现多个接口
//定义一个类的接口IEat
interface IEat{
    eatApple()
    eatRice()
}
//定义一个类的类型为IFly和IEat
class SuperMan implements IFly,IEat{
    fly(){
        return \'I can fly\'
    }
    eatApple(){
        return \'I can eat a apple\'
    }
    eatRice(){
        return \'Rice is delicious\'
    }
}
let superMan = new SuperMan()
console.log(superMan.fly())
console.log(superMan.eatApple())

接口可以继承
语法：
interface 接口名 extends 接口名1，接口名2,... {}

//定义一个接口，继承其他多个接口
interface IMix extends IFly,IEat{}
//类实现接口的方式同上