第三话：接口

接口初探

Animal接口规定，需要有一个string类型的属性name,其他属性不做规定，可有，也可没有

interface Animal {

    name: string,

};

function dog(data: Animal) {

    console.log(data.name);

}

let myDog = { size: 3, name: 'xiaoba' };

dog(myDog); // 传入的参数必须含有name属性

可选属性

使用?定义的属性，可以有，也可以没有

interface Animal {

    name?: string,

    color?: string,

};

function dog(data: Animal) {

    let anitialDog = { name: 'huahua', color: 'white' };

    if (data.name) {

        anitialDog.name = data.name;

    }

    if (data.color) {

        anitialDog.color = data.color;

    }

    return anitialDog;

}

let haShiQi = dog({ name: 'haShiQi' });  // { name: 'haShiQi', color: 'white' }

let black = dog({ color: 'black' }); // { name: 'huahua', color: 'black' }

只读属性

可以在属性前用readonly来标记只读属性，只在对象刚刚创建的时候可以修改其值

interface OnlyReadNum {

    readonly x: number,

    readonly y: number,

};

let va: OnlyReadNum = { x: 2, y: 6 };

va.x = 8; // error 

ReadonlyArray<T>只读数组类型：

let a: Array<number> = [ 1, 2, 3, 4 ];

let b: ReadonlyArray<number> = a;

b[0] = 8; // error

b.push(6); // error

b.length = 10; // error

a = b; // error 把readonly的数组整个赋值给一个普通数组也是不可以的

a = b as number[]; // 可以用类型断言重写

函数类型

函数类型的接口规定函数的参数列表和返回值

interface Animal {

    ( name: string, color: string ): boolean   // (参数列表): 返回值类型

}

let myAnimal = Animal;

myAnimal = function(name: string, color: string) { // 参数不必一定要和接口中的参数名字一样，只要对应位置的类型一样

    let love = (name === 'dog' && color === 'red') ? true : false;

    return love;

}

可索引的类型

提供两种索引：字符串和数字，数字索引的返回值必须要是字符串索引的子类型

interface StrArray {

    [index: number]: string

};

let aa: StrArray = [ 'a', 'b', 'c' ];

let cc: string = aa[0];