typeScript笔记整理

由于有新项目开发，打算尝尝很久之前就想用的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;