由于现在TS越来越重要，不卷起来就要被别人卷死，所以整理一套TS的学习资料，希望对一些刚学习的人有些帮助
TS是什么及为何要学习TS
- Typescript是由微软开发的一款开源的编程语言
- Typescript是Javascript的超集，遵循最新的ES5/ES6规范。TypeScript扩展了Javascript语法
- TypeScript更像后端Java、C#这样的面向对象语言可以让JS开发大型企业应用
- 越来越多的项目是基于TS的，比如VSCode、Angular6、Vue3、React16
- TS提供的类型系统可以帮助我们在写代码的时候提供更丰富的语法提示
- 在创建前的编译阶段经过类型系统的检查，就可以避免很多线上的错误
1：数据类型
1.1布尔类型/数字类型/字符串类型
let isTrue: boolen=true
let old：number=18
let name: string="张三"
1.2 数组类型及元组类型
数组：
let arr:number[]=[1,2,4]
或者
let arr:Array<number>=[3,6,2]
元组
let arr:[string,number]=['qwe',123]
元组中每个数据类型都必须对应
1.3 枚举类型
enum sex{
boy,
girl
}
console.log(`张三是${sex.boy}`); //张三是0
console.log(`李四是${sex.girl}`);//李四是1
//在枚举中还可以自己指定值
如：
enum month{
January=1,
February=2
}
console.log(`今天是${month.January}月`)// 今天是1月
常数枚举
const enum color{black,white,green}
console.log(color.black,color.white) // 0 1
1.4 任意类型
- 任意类型也就是any
let root:any=document.getElementById('root');
root.style.color='red';
let root:(HTMLElement|null)=document.getElementById('root');
root!.style.color='red';//非空断言操作符
1.5 null和undefined
- null 和 undefined 是其它类型的子类型，可以赋值给其它类型，如数字类型，此时，赋值后的类型会变成 null 或 undefined
strictNullChecks参数用于新的严格空检查模式,在严格空检查模式下， null 和 undefined 值都不属于任何一个类型，它们只能赋值给自己这种类型或者 any
let x: number;
x = 1;
x = undefined;
x = null;
let y: number | null | undefined;
y = 1;
y = undefined;
y = null;
1.6 void类型和never类型
- 当一个函数没有返回值时，返回值就是void类型
- never是其它类型(null undefined)的子类型，代表不会出现的值 比如函数执行有异常，或者死循环等等
- void 代表没有任何类型
- strictNullChecks=false null 可以赋值 void strictNullChecks=true,不行了
function fail() { return error("Something failed"); }
let result = fail(); // 返回never的函数 必须存在 无法达到（ unreachable ） 的终点
function infiniteLoop(): never { while (true) {} }
1.7 Symbol
- 我们在使用 Symbol 的时候，必须添加 es6 的编译辅助库 也就是tsconfig.json 文件中 lib数组里加‘ESNext’
- Symbol 是在ES2015之后成为新的原始类型,它通过 Symbol 构造函数创建
- Symbol 的值是唯一不变的
1.8 BinInt
- 使用 BigInt 可以安全地存储和操作大整数
- 我们在使用
BigInt的时候，必须添加ESNext的编译辅助库 - 要使用
1n需要"target": "ESNext" - number和 BigInt类型不一样,不兼容
const max = Number.MAX_SAFE_INTEGER;// 2**53-1
console.log(max + 1 === max + 2); // true
const max = BigInt(Number.MAX_SAFE_INTEGER);
console.log(max + 1n === max + 2n); // false
1n也可写为BigInt(1)
1.9 类型推导
- 是指编程语言中能够自动推导出值的类型的能力，它是一些强静态类型语言中出现的特性，比如C#和java
- 定义时未赋值就会推论成any类型
- 如果定义的时候就赋值就能利用到类型推论
1.10 包装对象
-
JavaScript 的类型分为两种：原始数据类型（Primitive data types）和对象类型（Object types）。
-
所有的原始数据类型都没有属性（property）
-
原始数据类型
- 布尔值
- 数值
- 字符串
- null
- undefined
- Symbol
-
当调用基本数据类型方法的时候，JavaScript 会在原始数据类型和对象类型之间做一个迅速的强制性切换
let name = 'hello';
console.log(name.toUpperCase()); //HELLO
console.log((new String('hello')).toUpperCase()); //HELLO
let isOK: boolean = true; // 编译通过
let isOK: boolean = Boolean(1) // 编译通过
let isOK: boolean = new Boolean(1); // 编译失败 期望的 isOK 是一个原始数据类型
1.11 联合类型
- 联合类型（Union Types）表示取值可以为多种类型中的一种
- 未赋值时联合类型上只能访问两个类型共有的属性和方法
let name: string | number;
1.12 类型断言
- 类型断言可以将一个联合类型的变量，指定为一个更加具体的类型
- 不能将联合类型断言为不存在的类型
let name: string | number;
console.log((name as string).length);
console.log((name as number).toFixed(2));
console.log((name as boolean));
//双重断言
interface Person { name: string; age: number; }
const person = 'people' as any as Person; // ok
1.13 字面量类型和类型字面量
- 字面量类型的要和实际的值的字面量一一对应,如果不一致就会报错 ，可以实现枚举的效果
- 类型字面量和对象字面量的语法很相似
const up:'Up'= 'Up';
const down: "Down" = "Down";
const left: "Left" = "Left";
const right: "Right" = "Right";
type Direction = 'Up' | 'Down' | 'Left' | 'Right';
function move(direction: Direction) {}
move("Up");
type Person = {
name:string,
age:number
};
1.14 字符串字面量 vs 联合类型
- 字符串字面量类型用来约束取值只能是某
几个字符串中的一个, 联合类型（Union Types）表示取值可以为多种类型中的一种 - 字符串字面量 限定了使用该字面量的地方仅接受特定的值,联合类型 对于值并没有限定，仅仅限定值的类型需要保持一致
