什么是接口
在面向对象语言中,接口是一个很重要的概念,他是对行为的抽象,而具体如何行动需要由类去实现。
TypeScript
中的接口是一个非常灵活的概念,除了可用于对类的一部分行为进行抽象意外,也常用于对对象的形状
进行描述。
interface Human{
name: string;
age: number;
gender: string;
}
let zink: Human = {
name: 'zink',
age: 21,
gender: 'man',
}
在这个例子中,我们定义了一个接口Human
,接着定义了一个变量zink
,它的类型是Human
。这样,我们就约束了zink
的形状必须和接口Human
一致。
接口一般首字母大写。
定义的变量的属性不允许多于或少于接口。赋值的时候,变量的形状必须和接口的形状保持一致。
可选属性
有时候我们希望不要完全匹配一个形状,那么可以用可选属性:
interface Human{
name: string;
age?: number; //用?表示此属性可选
}
let zink: Human = {
name: 'zink',
}
let jack: Human = {
name: 'jack',
age: 18,
}
可选属性的含义是该属性可以不存在。
但此时依然不可以添加未定义的属性。
任意属性
按照以上的写法,在定义接口时难免有些死板,所以我们在某些场景下需要使用任意属性:
interface Human {
name: string;
age?: number;
[propName: string]: any
}
let zink: Human = {
name: 'zink',
age: 21,
gender: 'man',
height: 174,
}
使用[propName: string]
定义了任意属性的key
取string
类型的值。
注意点:一旦定义了任意属性,那么确定属性和可选属性必须是它的类型的子集
interface Human{
name: string;
age?: number;
[propName: string]: string;
}
let zink: Human= {
name: 'zink',
age: 25, //error
gender: 'man'
};
在这个例子中,任意属性的值是string
,但是可选属性age
的值却是number
,number
不是string
的子属性,所以报错。所以,对于任意属性,我们最好定义为any
只读属性
顾名思义,只读属性的含义是变量只能在创建的时候被赋值,此后只允许读取,不允许修改。用readonly
定义。
interface Human {
readonly id: number;
name: string;
age: number;
[propName: string]: any;
}
let zink: Human = {
id: 1,
name: 'zink',
age: 21,
gender: 'man'
}
zink.id = 2; //error
上例中,我们用readonly
定义了id
,id
在初始化赋值后又被赋值了,所以报错了。
注意,只读的约束存在于第一次给对象赋值的时候,而不是第一次给只读属性赋值的时候。