TypeScript总结

TypeScript

什么是TypeScript

1.TypeScript是JavaScript类型的超集（当前我们处于ES5），它可以编译成纯JavaScript。

TypeScript与JavaScript相比的优势

1.TypeScript工具使重构更变的容易、快捷。
2.TypeScript 引入了 JavaScript 中没有的“类”概念。
3.TypeScript 中引入了模块的概念，可以把声明、数据、函数和类封装在模块中
4.类型安全功能能在编码期间检测错误，这为开发人员创建了一个更高效的编码和调试过程。

let 和 const

不使用var，使用let或const申明变量，并加上类型说明，且作用域为块级即以{}为界。
代码如下：

let lang: string = ‘TypeScript’;//如果省略类型说明，TS也可进行自动推断
lang = 1010;//error! 如果需要可以使用联合类型：let lang: number | string = ‘TS’;
let age: number = 89;
let age = 64;//error!

const pi: number = 3.14159;//pi以后不可改变，类似常量
pi = 3.14;//error!

解构

将对象、数组中的元素拆分到指定变量中，以方便使用。

代码示例：

//解构数组

let input = [89, 64, 2018, 10];

let [first, second] = input;//注意使用[]

console.log(first); // 89

console.log(second); // 64

let [one, …others] = input; //剩余变量

console.log(…others);
//展开
let newArr = [89, …others, 18];

console.log(newArr);
//解构对象
let o = {
a: “foo”,
b: 12,
c: “bar”
};
let {a, b} = o;//注意使用{}，且变量名需与对象中道属性名一致
console.log(a, b);

函数

1.使用完整函数类型定义

2.可选参数：

3.默认参数：

4.剩余参数：

必要参数，默认参数和可选参数有个共同点：它们表示某一个参数。 有时，你想同时操作多个参数，或者你并不知道会有多少参数传递进来， 在TypeScript里，你可以把所有参数收集到一个变量里

//剩余参数，会被当做个数不限的可选参数。可以一个都没有，也可以有任意个
function greeting(firstName: string, …restName: string[]) {
return Hello ${firstName} ${restName.join(' ')}!;
}
console.log(greeting(‘Osama’, ‘bin’, ‘Muhammad’, ‘bin’, ‘Awad’, ‘bin’, ‘Laden’));
console.log(greeting(‘Laden’));

箭头函数：

特点：简化函数定义、解决this问题。

TypeScript支持的基本数据类型

1. 布尔类型（Boolean）
2. 数值类型（Number）
3. 字符串类型（String）
4. 数组类型
5. null和undefined
6. object
7. symbol类型

接口interface

用来描述对象的内部类型结构

类class

类是属性（有些什么）和函数（能干什么）的集合，是生成对象（Object）或类实例的模板。

类的定义和属性

class MyInfo { //class是关键字，类名默认全部大写首字母
name: string; //属性
weather: string; //属性

类的属性和函数的访问权限

类中的属性和函数都有访问权限，默认为public即全局可访问，其次为protected即可在类的内部和其子类的内部可访问，最后为private，只能在该类内部可访问。

存取器-getter、setter

当在类外部时，建议设置getter和setter操作其private属性，即使public属性也如此。

//getter和setter
get name(): string {
return this._name;
}
set name(value: string) { //error！ _name有readonly属性
this._name = value;
}
get weather(): string {
return this._weather;
}
set weather(value: string) {
this._weather = value;
}

静态属性

类中的属性或函数有static修饰，则可直接使用而不需要实例化。

继承

可以通过extends关键字继承其它类，从而成为其子类

模块Module

对于大型的项目，我们需要使用模块进行管理。每个 .ts 文件就是一个模块，通过 export 来对外部模块暴露元素，通过 import 来引入模块。