Ts学习日记（三）

目录

摘要

1、什么是接口

2、定义一个接口

2.1 对象接口

2.2 函数类型接口

2.3 可索引接口

2.4 类类型的接口（最常用）

3、接口扩展

---

摘要

        今天主要学习了Ts的接口。

1、什么是接口

        接口的话，相信学过面向对象语言的都不会陌生。其实通俗一点来讲，接口就相当于是一个全是抽象函数的抽象类。更通俗一点来说，接口就相当于是甲方，甲方说我要xxx，你就要去实现xxx。在官方一些的语言说下来，接口如下：

在面向对象编程中，接口是一种规范的定义，它定义了行为和动作规范。

在程序设计里面，接口起到一种限制和规范的作用。接口定义了某一批所需要遵守的规范。

接口不关心这些类内部状态数据，也不关心这些类里面方法的实现细节它只规定了这批类里必须提供某些方法，提供这些方法的类就可以满足实际需要。

2、定义一个接口

定义接口使用interface关键字

2.1 对象接口

interface Name{
    name: String;
    name2: string;
}
// 规定name必须要是一个对象，并且有name: String;name2: string;这两个属性
function aa(name:Name):void{
    console.log(name.name+name.name2);
}
const obj:any={
    name:"123",
    name2:"456"
}
aa(obj);
// 定义接口的可选参数 使用？来表示这个参数可传可不传
interface Name1{
    name: String;
    name2?: string;
}
// 规定name必须要是一个对象，并且有name: String;name2: string;这两个属性
function aa1(name:Name1):void{
    // console.log(name.name+name.name2);
    console.log(name.name);
}
const obj1:any={
    name:"123",
    // name2:"asd"
}
aa1(obj1);

2.2 函数类型接口

// 函数类型的接口定义

interface ent{
    // （）里面是参数；即（参数1，参数2.。。）:返回值类型
    (key:string,value:string):string;
}

const fn1:ent = function(key:string,value:string):string{
    return key+value;
}
console.log(fn1("name","zhangsan"));

2.3 可索引接口

// 可索引接口（对数组、对象的约束）（不常用）
// 数组类型时
interface arr{
    // 下标（索引）只能为数字类型，值为string类型（值的类型可以是any之类的其他类型）
    [index:number]:string;//相当于一个string类型的数组
}
const arr1:arr = ['aa','bb'];

// 对象类型时
interface obj{
    // 索引为string类型，值也为string类型（值的类型可以是any之类的其他类型）
    [index:string]:string;
}
const obg1:obj = {
    name:"aa",
    age:"12"
}

2.4 类类型的接口（最常用）

// 类类型的接口（经常用，和Java差不多）
interface animal{
    name:string;
    eat(str:string):void;
}
// implements关键字来实现接口
class Dog implements animal{
    name:string;
    constructor(name:string){
        this.name = name;
    }
    eat():void{
        console.log(this.name + "吃骨头");
    }
}

const d = new Dog("大黄");
d.eat();

class Cat implements animal{
    name:string;
    constructor(name:string){
        this.name = name;
    }
    eat(food:string):void{
        console.log(this.name + "吃" + food);
    }
}

const c = new Cat("小花");
c.eat("鱼");

3、接口扩展

接口扩展实际上就是接口继承接口

// 扩展接口实际上就是接口继承接口
interface animal1{
    name:string;
    eat():void;
}

interface Person1 extends animal1{
    work():void;
}

class Person{
    name:string;
    constructor(name:string){
        this.name = name;
    }
    coding():void{
        console.log(this.name + "写ts代码");
    }
}

// 类既能继承父类，也能实现接口，二者互不影响（不过，类名和接口名不能一样）
class web extends Person implements Person1{
    constructor(name:string){
        super(name);
    }
    work():void{
        console.log(this.name + "写代码");
    }
    eat():void{
        console.log(this.name + "吃食物");
    }
}

const w = new web("张三");

w.coding();
w.eat();
w.work();