TypeScript 基础语法——接口

203 阅读1分钟

接口 interface

// 接口
interface Person{
    username:string,
    age:number
}
let user : Person ={
    username:'xxx',
    age:24,
}

可选属性

通过?进行标注

只读属性

除了初始化以外不可以再进行复制

任意属性

通过索引类型实现

数字类型索引

interface Point {
x: number;
y: number;
[prop: number]: number;
}

字符串类型索引

interface Point {
x: number;
y: number;
[prop: string]: number;
}

数字索引是字符串索引的子类型

注意:索引签名参数类型必须为 string 或 number 之一,但两者可同时出现

注意:当同时存在数字类型索引和字符串类型索引的时候,数字类型的值类型必须是字符串类型 的值类型或子类型

interface Point1 {
[prop1: string]: string;
[prop2: number]: number; // 错误
}

interface Point2 {
[prop1: string]: Object;
[prop2: number]: Date; // 正确
}

使用接口描述函数

我们还可以使用接口来描述一个函数

interface IFunc {
(a: string): string;
}
let fn: IFunc = function(a) {}

注意,如果使用接口来单独描述一个函数,是没 key 的

接口合并

多个同名的接口合并成一个接口

interface Box {
height: number;
width: number;
}

interface Box {
scale: number;
}
let box: Box = {height: 5, width: 6, scale: 10}

如果合并的接口存在同名的非函数成员,则必须保证他们类型一致,否则编译报错

接口中的同名函数则是采用重载