TypeScript中的类型详解
2021年，TypeScript非常火热，前端的各大主流框架和工具，都在向TypeScript靠拢，TypeScript让前端开发复杂大型项目更加严谨。极大的降低了代码出现bug的几率，也大大增强了代码的可维护性和可读性，代码即文档，TypeScript的这一理念，让TypeScript在前端大放异彩。那么接下来，我来讲讲TypeScrpt中的类型。
首先，我们来对比一下JavaScript和TypeScript。
JavaScript易学易用，非常灵活，可以随心所欲写代码，不容易报错。但是复杂代码生产环境容易出现问题，维护成本比较高，也不是非常好排查问题。JavaScript主要用来实现用户和浏览器的交互，实现前端的动态效果，在前端JavaScript是独一无二且不可替代的编程语言。但是JavaScript还是有一些缺陷，如面向对象写起来非常麻烦（es6解决了这个缺点），JavaScript是动态的类型，编辑器的对于类型的提示不是特别完善。那么，TypeScript可以非常完美的解决JavaScript的这些问题。
TypeScript非常严谨，微软在设计TypeScript的时候，就意在解决JavaScript的缺点。TypeScript是以JavaScript为基础构建的编程语言，是JavaScript的超集，对JavaScript进行了扩展，并添加了很多类型，TS支持几乎所有es6+的新特性，开发工具的提示非常友好。但是要注意的是，TS不能直接运行，需要编译成为JS才能运行。
TS的开发环境只需要电脑安装好nodejs，然后使用全局命令安装ts
npm i -g typescript
之后，就可以使用tsc命令，把TS文件，编译为JS文件。
tsc fileName.ts // 编译ts文件 生产对应的js文件
接下来，来看看TS中的类型。
首先，类型声明是TS非常重要的特性，可以指定变量、形参、返回值等等的类型。指定类型后，当为变量赋值时，TS编译器会自动检查值是否符合之前声明的类型，如果符合则通过，不符合，就会报错。类型声明给变量规定了类型，变量就变得像强类型的编程语言一样，只能存储特定类型的值。
语法如下：
let 变量：类型; let 变量: 类型 = 值; function fn(参数1：类型，参数2：类型): 类型 { ... } |
其次，TS还有自动类型判断机制，当对变量的声明和赋值同时进行的时候，TS编译器会自动判断变量是什么类型的，如果变量声明和赋值是同时进行的，可以直接省略掉类型声明。
TS完整数据类型如下：
number: 任意数字
let num: number = 100;
string: 任意字符串
let str: string = 'abc'
boolean: 布尔值
let isOk: boolean = true;
字面量: 其本身限制变量的值就是其字面量的值
let skill: 'html' | 'css' | 'javaScript';
any: 任意类型
let temp: any = 10;
temp = 'itsource';
temp = true;
unknown 类型安全的any
let temp: unknown = 4;
temp = 'hello';
void: 空值( undefined )没有值（ 或undefined ）
let temp: void = undefined;
never没有值不能是任何值
function showError(message: string): never {
throw new Error(message)
}
object: 任意的JavaScript对象
let obj: object = {}
array: 任意js数组
let arr: number[] = [1, 2, 3];
tuple: 元组， TS新增类型，固定长度数组。
let arr: [number, string]
arr = [666, 'abc']
enum: 枚举，TS新增类型。
enum Hob {
Html,
Css,
JavaScript,
}
let hobby: Hob = Hob.JavaScript;
以上，就是TypeScript中完整的数据类型，掌握TypeScript完整数据类型，更有利于用好TypeScript开发大型复杂应用。
更多IT技术请关注源码时代。