这是我参与「第四届青训营 」笔记创作活动的第2天

TypeScript发展历史

• 2012-10: 微软发布了 TypeScript 第一个版本（0.8）
• 2014-10: Angular发布了基于TypeScript 的 2.0版本
• 2015-04: 微软发布了 Visual Studio Code
• 2016-05: @types/react发布，TypeScript可开发React
• 2020-09: Vue发布了3.0版本，官方支持 TypeScript
• 2021-11: V4.5版本发布

为什么是TypeScript?

• 静态类型

  • 可读性增强：基于语法解析TSDoc，ide增强
  • 可维护性增强：在编译阶段暴露大部分错误

  有了静态类型，在多人合作的大型项目中可以获得更好的稳定性和开发效率

• 是JS的超集

  • 包含于兼容所有JS特性，支持共存
  • 支持渐进式引入与升级

基本语法

基础数据类型

JS中的数据类型全都在TS中得到支持

对象类型

在ts中，声明对象的类型可以通过interface或type去实现，并且能够通过修饰符（如readonly、?）对属性进行修饰限制

函数类型

给参数声明类型就和给普通变量声明类型一样，用:加上类型即可

而函数返回值的类型则要看情况，既可以用type声明返回值类型，也可以在interface中声明

用type声明的话则是像箭头函数一样，用=>将类型标注出来 在interface中声明函数则和参数的类型声明类似，使用:加上类型标注即可

比如下面这个js函数：

对应的ts声明：

函数重载

可以声明一个同名函数的不同参数类型

数组类型

最普通的就是类型[]这样的方式声明一个数组类型

type Arr1 = number[]

也可以通过泛型的方式，以Array<number>的方式声明数组

type Arr2 = Array<number>

还可以用元组的方式声明数组，但是这样声明出来的数组是定长的，并且对应位置的元素类型也要对应才行

type Arr3 = [number, number, string, string]

也可以用interface的方式声明数组，约束键的类型为number即可

interface Arr4 {
    [key: number]: any
}