I
,方便知晓这是个接口)
age?:number
[propName: string]: any
readonly id: number
// 基本使用
interface IPerson {
name: string;
age: number;
}
const per: IPerson = { name: 'Lance', age: 23 };
// 对象的实现得和接口完全匹配
interface IPerson { // 接口一旦定义,per 对象的属性就必须得只有两个属性,不能多也不能少
name: string;
age: number;
}
const per: IPerson = { name: 'Lance' }; // 不写 age ,会报错缺少 age 属性
// 可选属性
interface IPerson {
name: string;
age: number;
weight?: number; // 可选属性
}
const per: IPerson = { name: 'Lance', age: 23 }; // 可以不写 weight
// 让对象的实现有 interface 中没有的属性(任意属性)
interface IPerson {
name: string;
age: number;
weight?: number; // 可选属性
[propName: string]: any // 对象可以有其他属性
}
const per: IPerson = { name: 'Lance', age: 23, run: function() {}, sex: 'male' }
// 只读属性
interface IPerson {
readonly id: number;
name: string;
age: number;
weight?: number; // 可选属性
[propName: string]: any // 对象可以有其他属性
}
const per: IPerson = { id: 1, name: 'Lance', age: 23, sex: 'male' }
per.id = 233; // 报错
TypeScript具有ReadonlyArray<T>
类型,它与Array<T>
相似,只是把所有可变方法去掉了,因此可以确保数组创建后再也不能被修改:
let a: number[] = [1, 2, 3, 4];
let ro: ReadonlyArray<number> = a;
ro[0] = 12; // error!
ro.push(5); // error!
ro.length = 100; // error!
a = ro; // error!
接口也可以描述函数类型。因为函数也可以理解为一个对象
interface SearchFunc {
(source: string, subString: string): boolean;
}
let mySearch: SearchFunc;
mySearch = function(source: string, subString: string) {
let result = source.search(subString);
return result > -1;
}
interface StringArray {
[index: number]: string;
}
let myArray: StringArray;
myArray = ["Bob", "Fred"];
let myStr: string = myArray[0];
interface ClockInterface {
currentTime: Date;
}
// 表示 Clock 类要 实现 ClockInterface 接口
class Clock implements ClockInterface {
currentTime: Date;
constructor(h: number, m: number) { }
}
interface ClockInterface {
currentTime: Date;
setTime(d: Date);
}
class Clock implements ClockInterface {
currentTime: Date;
setTime(d: Date) {
this.currentTime = d;
}
constructor(h: number, m: number) { }
}