接口：定义行为动作的规范

属性接口、函数类型接口、可索引接口、类类型接口、

1、属性接口  对JSON的约束

function printLabel(label: string): void {console.log('printLabel');
}
printLabel('字符串')function printLabel2(labelInfo: { label: string }): void {console.log('printLabel2');
}
printLabel2({ name: 'li' }) // 错误写法
printLabel2({ label: 'li' })

对批量方法传入参数进行约束

接口：行为和动作的规范，对批量方法进行约束

interface FullName {firstName: string; // 注意;结束secondName: string;age?: number // 添加问号为可选属性，可传可不传
}function printName(name: FullName) {// 必须传入对象，必须包含firstName,secondName字段并且都是字符串console.log(name.firstName + name.secondName);
}// 传入的对象必须包含 firstName 和 secondName
const obj = {firstName: '1',secondName: '2',c: 1
}
printName(obj)

 封装ajax接口定义

interface Config {type: string,url: string,data?: string,dataType: string
}function ajax(config: Config) {var xhr = new XMLHttpRequest();xhr.open(config.type, config.url, true)xhr.send(config.data)xhr.onreadystatechange = function () {if (xhr.readyState == 4 && xhr.status == 200) {if (config.dataType == 'json') {JSON.parse(xhr.responseText)} else {console.log('成功', xhr.responseText);}}}
}
ajax({type: 'get',data: 'datadatdatatatat',url: 'http://www.baidu.com',dataType: 'json'
})

2、函数接口类型 对方法传入的参数以及返回值进行约束

// 加密的函数类型接口
interface encrypt {(key: string, value: string): string;
}var md5: encrypt = function (key: string, value: string) {// 模拟操作return key + value
}
console.log(md5('name', 'val'));

 3、可索引接口 数组、对象的约束（不常用）

// ts定义数组的方式
var arr1: number[] = [1, 2]
var arr2: Array<string> = ['1', '2']// 可索引接口对数组的约束
interface UseArr {[index: number]: string
}
var arr3: UseArr = ['1', '2']// 可索引接口对对象的约束
interface UseObj {[index: string]: string
}
var obj: UseObj = { name: '20', wof: '50' }

4、类类型接口 对类的约束 和抽象类相似

interface Animal {name: string;eat(str: string): void;
}class Dog implements Animal {public name: string;constructor(name: string) {this.name = name}eat() {console.log(this.name);}
}
var d = new Dog('小黑')
d.eat()class Cat implements Animal {public name: string;constructor(name: string) {this.name = name}eat(food) {console.log(this.name + food);}
}
var c = new Cat('小花')
c.eat('🐟')

5、接口的扩展 接口可以继承接口

interface Animal {eat(): void;
}
interface Person extends Animal {work(): void;
}
class Progromer {constructor(name: string) {this.name = name}coding(code: string) {console.log(this.name + code);}
}class Web extends Progromer implements Person {constructor(name: string) {super(name)}eat() {console.log(this.name + '吃');}work() {console.log(this.name + '工作');}
}
var w = new Web('丧彪')
w.eat()
w.work()
w.coding('ts')