NO6 ts中的接口：属性类接口，函数类接口，可索引接口，类类型接口以及接口的继承

/**接口：属性类接口，函数类接口，可索引接口，类类型接口

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

 * 在程序设计里面，接口起到一种限制和规范的作用。

 * 接口定义了某一批类所需要的规范，不关心类的内部状态数据、实现细节，只规定类中必须提供某些方法。

*/

// 1 属性接口

   /*

    function printLable(labelInfo: {label: string}):void {

        console.log(labelInfo.label)

    }

    // printLable('kfjkdlsf')

    // printLable({name: 'zs'})

    printLable({label: 'zs'})

   */

    //   通过接口对方法进行批量约束

    interface FullName {

        firstName: string; // 注意;结束

        secondName?: string // 可选

    }

    function printName(name: FullName):void {

        console.log(name.firstName + '---' + name.secondName)

    }

    function printInfo(info: FullName):void {

        console.log(info.firstName + '---' + info.secondName)

    }

    // printName({

    //     firstName: '张',

    //     secondName: '三'

    // })

    // printInfo({

    //     firstName: '李'

    // })

    // 实现$.ajax

    interface Config {

        type: string;

        url: string;

        data?: string;

        dataType: string; // json

    }

    function ajax(config: Config) {

        var xhr = new XMLHttpRequest();

        xhr.open(config.type, config.url, true)

        xhr.send()

        xhr.onreadystatechange = function() {

            if (xhr.readyState === 4 && xhr.status === 200) {

                // console.log(xhr)

                if (config.dataType === 'json') {

                    // console.log(JSON.parse(xhr.responseText))

                } else {

                    // console.log(xhr.responseText)

                }

            }

        }

    }

    ajax({

        type: 'get',

        data: 'name=zhangsan',

        url: 'http://a.itying.com/api/productlist',

        dataType: 'json'

    })

// 2 函数类型接口： 对方法传入的参数以及返回值进行约束 批量约束。如下，实现加密的函数类型接口

interface enrypt {

    (key:string, value:string):string

}

var md5:enrypt = function(key:string, value: string):string {

    return key+value

}

// console.log(md5('name','张三'))

var sha1:enrypt = function(key:string, value: string):string {

    return key+value

}

// console.log(sha1('name','李四'))

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

// var arr1:number[] = [1,2]

// var arr2:Array<string> = ['a','n']

interface UserArr { // 对数组的约束

    [index:number]: string

}

var arr3:UserArr = ['1','2']

console.log(arr3)


interface UserObj { // 对对象的约束

    [index:string]: string

}

var obj:UserObj = {name: '20'}

// 4 类类型接口： 对类的约束， 和抽象类有点相似

interface Animal{

    name: string;

    eat(str:string):void

}

class Dog implements Animal {

    name: string;

    constructor(name: string) {

        this.name = name

    }

    eat() {

        console.log(this.name + '吃肉')

    }

}

new Dog('小黑').eat()

class Cat implements Animal {

    name: string;

    constructor(name: string) {

        this.name = name

    }

    eat(food: string) {

        console.log(this.name + '吃' + food)

    }

}

new Cat('小猫').eat('鱼')

// 5 接口扩展: 接口可以继承接口

interface Animal1{

    eat():void

}

interface Person extends Animal {

    work():void

}

class Programmer {

    name: string

    constructor(name: string) {

       this.name = name 

    }

    coding() {

        console.log(this.name + '写代码')

    }

}

class Web extends Programmer 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()