TypeScript

---

前言

一个小白的学习历程，用自己的的亲身经历为各位还未步入职场的朋友们先探探路。qvq

---

TS

提示：这是TS篇

一、概述

TypeScript（简称 TS）是JavaScript的超集（继承了JS全部语法），TypeScript = Type +
JavaScript。

简单说，就是在JS的基础上，为JS添加了类型支持。

TypeScript是微软开发的开源编程语言，可以在任何运行JavaScript的地方运行。

//js
let uname = 'Tom'
//ts
let uname: string = 'Tom'

类型注解：是指在变量、函数等定义的时候，使用特定语法（: type）来指定其类型，并在代
码中限制只能接收特定类型的值

好处：
动态类型语言：

1. 编写bug多，影响开发效率
2. 运行时才会发现问题
3. 开发工具代码提示功能弱
4. 不便项目维护

静态类型语言

1. 有利于发现错误（编写时）
2. 有利于代码的静态分析
3. 便于语法提示和自动补全
4. 利于项目维护

编译命令： tsc demo.ts

注意：TS代码编译目标版本为es3(比较低)，可以通过参数 –target 指定编译的目标版
本。如：es5、es6、es2016… esnext

二、常用类型

2.1基础类型

基础类型：string，number，boolean，null，undefined，any，数组。

原则上，不推荐使用any!!! 这会让TypeScript又回到JavaScript(失去TS类型保护的优势)

2.2联合类型

联合类型：是指由两个或多个其他类型组成的类型，表示可以是其中的任意一种。

写法：类型1 | 类型2

TS中的联合类型中指定的多种类型之间使用 | 分隔，建议使用()括起来。

类型别名：相当于一种自定义类型，为任意类型起别名。

使用场景：当同一类型（复杂）别多次使用时，可以通过类型别名，简化该类型（复杂）的
书写。

定义语法：type customType = 指定类型

类型别名type，是可以为任意类型指定别名的。

2.3 函数类型

函数类型实际上指的是：函数的参数及返回值的类型

语法一：单独指定参数、返回值类型

与JS不同，TS中函数调用时传入的参数个数必须与函数定义时参数个数一致。

语法二：书写完成函数类型（同时指定参数、返回值类型）

可选参数：在TS里我们可以在参数后使用？实现可选参数的功能。而且可选参数只能出现在
参数列表的最后。

如果函数没有返回值，则函数的返回值类型为：void

2.4 对象类型 & 接口interface

对象类型

TS中的对象类型就是来描述对应的结构的（有什么类型的属性和方法）

说明：

1. 直接使用{}来描述对象的结构。属性采用 属性名:类型 的形式；方法采用 方法名():返回值类型的形式。
2. 如果方法有参数，就在方法名后面的小括号中指定参数类型（如：say(content:string):void）
3. 在一行中指定多个属性类型时，可以使用 逗号/分号 来分割。
4. 方法的类型，也可以使用箭头函数形式，比如：say:() => void。
5. 对象的属性或方法，也可以是可选的，此时就可以声明可选属性/方法，使用？（问号）来表示。

接口interface

当一个对象类型被多次使用时，我们可以使用 接口（interface）来描述对象的类型，达到 复用 的
目的。

说明：

1. 接口使用 interface 关键字来声明，接口名称可以是任意合法的变量名称。
2. 接口中定义的属性或方法，结尾可以使用逗号(,)/分号(;)分隔；如果每一行只有一个属性，后面也可以不写分号（;）

Interface（接口） 与 type（类型别名）对比：

相同点：都可以给对象指定类型。

不同点：

interface（接口），只能为对象指定类型。

type（类型别名），可以为任意类型指定别名。

2.5类型推论

在TS中，在有些没有明确指出类型的地方，类型推论会帮助提供类型。

换句话说：由于类型推论的存在，某些地方，类型注解是可以省略不写的。

常见场景：

1. 声明变量并初始化
2. 决定函数返回值时