由于有新项目开发,打算尝尝很久之前就想用的ts.....换点新花样吧。
内置对象
ECMAScript 标准提供的内置对象有:Boolean、Error、Date、RegExp 等。
DOM 和 BOM 提供的内置对象有:Document、HTMLElement、Event、NodeList 等。
/************************************************/
在 TypeScript 中,可以使用 null 和 undefined 来定义数据为空,null==undefined
/************************************************/
数组的类型声明
「类型 + 方括号」表示法
let fibonacci: number[] = [1, 1, 2, 3, 5];
数组泛型表示
let fibonacci: Array<number> = [1, 1, 2, 3, 5];
用接口表示数组
interface NumberArray {
[index: number]: number;
}
let fibonacci: NumberArray = [1, 1, 2, 3, 5];
类数组(Array-like Object)不是数组类型,比如 arguments
arguments 实际上是一个类数组,不能用普通的数组的方式来描述,而应该用接口
实上常用的类数组都有自己的接口定义,如 IArguments, NodeList, HTMLCollection 等
function sum() {
let args: IArguments = arguments;
}
any 在数组中的应用
一个比较常见的做法是,用 any 表示数组中允许出现任意类型:
let list: any[] = ['xcatliu', 25, { website: 'http://xcatliu.com' }];
/************************************************/
interface 接口使用(通常来表示对象json):
interface Person {
name: string;
age?: number; //表示可选
[propName: string]: any; //表示对象可以添加任意属性的值
}
let tom: Person = {
name: 'Tom',
gender: 'male'
};
let com: Person = {
name: 'com',
age?: number; //表示可选
json: tom //这里又引入了上面的tom对象类型
};
/************************************************/
函数声明用法
一般写法
let mySum = function (x: number, y: number): number {
return x + y;
};
ts的简写:
let mySum: (x: number, y: number) => number = function (x: number, y: number): number {
return x + y;
};
注意不要混淆了 TypeScript 中的 => 和 ES6 中的 =>
在 TypeScript 的类型定义中,=> 用来表示函数的定义,左边是输入类型,需要用括号括起来,右边是输出类型。
在 ES6 中,=> 叫做箭头函数。
用接口定义函数的形状:
interface SearchFunc {
(source: string, subString: string): boolean;
}
let mySearch: SearchFunc;
mySearch = function(source: string, subString: string) {
return source.search(subString) !== -1;
}
/************************************************/
类型断言
有时候会获取window上面的属性,直接window.XXX 会报错没定义。
此时我们可以使用 as any 临时将 window 断言为 any 类型:
(window as any).foo = 1;