TypeScript

类型系统的主要优势可以显示标记出代码中的意外行为从而降低了发生错误的可能性

类型注解

声明了类型后TypeScript就会进行类型检测声明的类型可以称之为类型注解

var/let/const

原始类型number/string/boolean/null/undefined/symbol

新增类型

联合类型、自定义类型(类型别名)、接口、元组、字面量类型、枚举、void、any

原始类型在

中更加细化每个具体的对象比如数组、对象、函数都有自己的类型语法

原始/基本类型

原始类型number/string/boolean/null/undefined/symbol

特点简单这些类型完全按照

在TypeScript中它们各自的类型也是undefined和null也就意味着它们既是实际的值也是自己的类型

null

注意事项在真实的开发中数组一般存放相同的类型不要存放不同的类型

元组类型

元组类型tuple属于数组类型中一种元组类型规定了数组的长度、数组中数据类型的顺序

一旦规定了元组类型那么数组里面的数据类型必须按照规定的顺序排列并且长度也必须按照元组中的长度取存放

场景在地图中使用经纬度坐标来标记位置信息

可以使用数组来记录坐标那么该数组中只有两个元素并且这两个元素都是数值类型

number[]

元组类型是另一种类型的数组它确切地知道包含多少个元素以及特定索引对应的类型

let

元组类型可以确切地标记出有多少个元素以及每个元素的类型该示例中元素有两个元素每个元素的类型都是

number

数组中通常建议存放相同类型的元素不同类型的元素是不推荐放在数组中

元组中每个元素都有自己特性的类型根据索引值获取到的值可以确定对应的类型

应用场景

枚举的功能类似于字面量类型联合类型组合的功能也可以表示一组明确的可选值

枚举定义一组命名常量。

它描述一个值该值可以是这些命名常量中的一个

enum类型是对JavaScript的标准数据类型的补充比如支付状态0失败1成功2超时

创建枚举

关键字定义枚举约定枚举名称以大写字母开头枚举中的多个值之间通过

数字枚举

注意字符串枚举没有自增长行为因此字符串枚举的每个成员必须有初始值

enum

一旦用枚举定义了数据那么这个数据是不能被修改的也不能增加额外的属性。

enum

如果enum中的值是字符串那么只能通过左侧的属性进行访问不能通过右侧的值去访问。

什么数据需要用到枚举

因为其他类型仅仅被当做类型而枚举不仅用作类型还提供值(枚举成员都是有值的)

enum

说明枚举与前面讲到的字面量类型联合类型组合的功能类似都用来表示一组明确的可选值列表

一般情况下推荐使用字面量类型联合类型组合的方式因为相比枚举这种方式更加直观、简洁、高效

any

在某些情况下我们确实无法确定一个变量的类型并且可能它会发生一些变化这个时候我们可以使用any类型

我们可以对any类型的变量进行任何的操作包括获取不存在的属性、方法

let

如果对于某些情况的处理过于繁琐不希望添加规定的类型注解或者在引入一些第三方库时缺失了类型注解这个时候我们可以使用any

unknown是TypeScript中比较特殊的一种类型它用于描述类型不确定的变量

原则:不推荐使用

做任何事情都是不合法的必须要通过类型校验才可以进行其他操作any

联合类型

TypeScript的类型系统允许我们使用多种运算符从现有类型中构建新类型

联合类型是由两个或者多个其他类型组成的类型类型之间进行或的操作

需求数组中既有

中叫做联合类型即由两个或多个其他类型组成的类型表示可以是这些类型中的任意一种

只要保证是联合类型中的某一个类型的值即可但是我们拿到这个值之后我们应该如何使用它呢因为它可能是任何一种类型。

比如我们拿到的值可能是string或者number我们就不能对其调用string上的一些方法

我们需要使用缩小narrow联合

TypeScript可以根据我们缩小的代码结构推断出更加具体的类型

function

但是有同时满足是一个number又是一个string的值吗其实是没有的所以MyType其实是一个never类型

interface

使用场景当同一类型复杂被多次使用时可以通过类型别名简化该类型的使用

type

CustomArray可以是任意合法的变量名称推荐使用大写字母开头创建类型别名后直接使用该类型别名作为变量的类型注解即可

undefined和null

如果你需要将数据清空这个时候直接赋值undefined或者是null会数据类型不匹配的错误你可以给变量定义多个数据类型。

undefined和null区别

如果一个函数中是一个死循环或者抛出一个异常那么这个函数会返回东西吗

不会那么写void类型或者其他类型作为返回值类型都不合适我们就可以使用never类型

例如never类型指哪些总是抛出错误或异常的函数的返回值类型或者值的类型。

let

开发中很少实际去定义never类型某些情况下会自动进行类型推导出never

函数类型

解释当函数作为表达式时可以通过类似箭头函数形式的语法来为函数添加类型

注意这种形式只适用于函数表达式

我们可以将null和undefined赋值给void类型也就是函数可以返回null或者undefined

如果一个函数没有返回值此时在

使用函数实现某个功能时参数可以传也可以不传。

这种情况下在给函数参数指定类型时就用到可选参数了

slice

注意可选参数只能出现在参数列表的最后也就是说可选参数后面不能再出现必选参数

function

{console.log(point.x);console.log(point.y);

}printPoint({x:

各司其职自动提示方法和属性每个重载签名函数完成各自功能输出取值时不用强制转换就能出现自动提示从而提高开发效率】

优势3

在TypeScript中如果我们编写了一个add函数希望可以对字符串和数字类型进行相加应该如何编写呢

那么这个代码应该如何去编写呢

在TypeScript中我们可以去编写不同的重载签名overload

一般是编写两个或者以上的重载签名再去编写一个通用的函数以及实现

type

我们现在有一个需求定义一个函数可以传入字符串或者数组获取它们的长度

这里有两种实现方案

匿名函数是否需要添加类型注解最好不要添加注解因为它自身会进行上下文推导

const

在ts中object类型是主要是[]、{}、function三种类型的复核类型。

let

object是复核类型不要随意用因为你不知道这个数据应该传递数组还是对象还是函数一旦传递错误会报语法错误。

空对象

string]代表对象的键只能是字符串类型右侧的any代表值是任意类型

使用类型别名

推荐能省略类型注解的地方就省略偷懒充分利用TS类型推论的能力提升开发效率

VSCode

进行类型推导推导出来的字面量类型可作为一个类型使用常用于联合类型中

let

是一个变量(let)它的值可以是任意字符串所以类型为:string

str2

比如在贪吃蛇游戏中游戏的方向的可选值只能是上、下、左、右中的任意一个

使用自定义类型:

HTMLElement该类型只包含所有标签公共的属性或方法不包含

href

后面的类型是一个更加具体的类型HTMLAnchorElement

HTMLElement

HTMLAnchorElementdocument.getElementById(link)et

value:

至于使用哪个大多数情况下是凭个人喜好然而当你在TypeScript里使用JSX时只有

__proto__

这是因为传入的message有可能是为undefined的这个时候是不能执行方法的

但是我们确定传入的参数是有值的这个时候我们可以使用非空类型断言

typeof

出现在类型注解的位置参数名称的冒号后面所处的环境就在类型上下文(区别于

代码)注意typeof

只能用来查询变量或属性的类型无法查询其他形式的类型比如函数调用的类型

undefined

在给定的执行路径中我们可以缩小比声明时更小的类型这个过程称之为

typeof

我们可以使用Switch或者相等的一些运算符来表达相等性比如,

and

left:console.log(left);break;case

right:console.log(right);break;case

center:console.log(center);break;default:console.log(default);}

instanceof

Date){console.log(date.toLocaleDateString());}else

{console.log(date);}

如果是定义非对象类型通常推荐使用type比如Direction、Alignment、一些Function

interface