接口初探
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
let a: Array
let b: ReadonlyArray
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];