TS中接口是用来定义对象的类型。TS中接口和泛型属于十分重要的类型。
在面向对象语言中,接口它是对行为的抽象,行动由类(Class)去实现(Implement),一个类可以实现多个接口
接口(interface)定义对象的类型
interface Person {
name: string;
age: number;
}
let tom: Person = {
name: 'Tom',
age: 25
};
使用接口定义对象的时候,定义的类型比接口少是不允许的,多一些属性也是不允许的
interface Person {
name: string;
age: number;
}
let tom: Person = {
name: 'Tom'
};
// index.ts(6,5): error TS2322: Type '{ name: string; }' is not assignable to type 'Person'.
// Property 'age' is missing in type '{ name: string; }'.
interface Person {
name: string;
age: number;
}
let tom: Person = {
name: 'Tom',
age: 25,
gender: 'male'
};
同时接口允许使用可选参数,即在参数后面加上?,表示这个参数可以没有
interface Person {
name: string;
age?: number;
}
let tom: Person = {
name: 'Tom',
age: 25
};
有时候,需要一个接口允许有任意的属性,可以使用以下方法
interface Person {
name: string;
age?: number;
[propName: string]: any;
}
let tom: Person = {
name: 'Tom',
gender: 'male'
};
使用 [propName: string] 定义了任意属性取 string 类型的值。
注意:一旦定义了任意属性,那么确定属性和可选属性的类型必须是它类型的子类.一般情况下,可以设置任意属性的值类型设置为任意类型(any)
interface Person {
name: string;
age?: number;
[propName: string]: string;
}
let tom: Person = {
name: 'Tom',
age: 25,
gender: 'male'
};
// index.ts(3,5): error TS2411: Property 'age' of type 'number' is not assignable to string index type 'string'.
// index.ts(7,5): error TS2322: Type '{ [x: string]: string | number; name: string; age: number; gender: string; }' is not assignable to type 'Person'.
// Index signatures are incompatible.
// Type 'string | number' is not assignable to type 'string'.
// Type 'number' is not assignable to type 'string'.
接口也可以使用修饰符号修饰。readonly 代表只读属性
interface Person {
readonly id: number;
name: string;
age?: number;
[propName: string]: any;
}
let tom: Person = {
id: 89757,
name: 'Tom',
gender: 'male'
};
tom.id = 9527;
// index.ts(14,5): error TS2540: Cannot assign to 'id' because it is a constant or a read-only property.
注意:只读的约束发生在给对象第一次赋值的时候,而不是只读属性赋值的时候
interface Person {
readonly id: number;
name: string;
age?: number;
[propName: string]: any;
}
let tom: Person = {
//已经赋值过
name: 'Tom',
gender: 'male'
};
tom.id = 89757; //重复赋值
// index.ts(8,5): error TS2322: Type '{ name: string; gender: string; }' is not assignable to type 'Person'.
// Property 'id' is missing in type '{ name: string; gender: string; }'.
// index.ts(13,5): error TS2540: Cannot assign to 'id' because it is a constant or a read-only property.
约束类型构造类型,使用new来约束
new():A :表示接受一个构造参数
class AnimalA {
constructor(public name:string) {
}
}
interface withAnimal {
new (c:string):AnimalA //表示该接口中必须需要一个构造函数
}
function createAnimal(clzz:withAnimal,name:string){
return new clzz(name)
}
createAnimal(AnimalA,"zw")
网友评论