三、ts常用类型

1、类型注解

作用:为变量添加类型约束

解释:只能赋值该类型

2、常用基础类型

2.1、js已有类型:

(1)原始类型:number、string、boolean、null、undefined、symbol

特点:简单,按js中类型名

原始类型

(2)对象类型:Object

特点:细化,都有自己的类型语法

2.2、新增类型:

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

3、对象类型细化:

3.1、数组类型:

number[](推荐)、Array

联合类型:|

(number|string|boolean)[]

数组类型

3.2、类型别名

自定义类型,为任意类型起别名

使用场景:同一复杂类型被多次使用,通过类型别名简化类型

解释:

(1)使用type关键字创建

(2)可是任意合法的变量名称

(3)直接使用该类型别名进行注解

类型别名

3.3、函数类型

函数参数返回值的类型。

(1)单独指定参数、返回值的类型;

单独指定参数、返回值类型

(2)同时指定参数、返回值的类型

同时指定参数、返回值类型

        ps:只适用于函数表达式

(3)函数返回值类型:void(函数没有返回值)

void

(4)可选参数:?(可选参数后面不能出现必选参数)

可选参数:?

3.4、对象类型

描述对象的结构

对象类型写法

ps:;(分号)分隔(分号相当于换行鸭~),如果一行代码只指定一个属性类型(换行指定另一个),可以去掉分号

对象的属性可有可无,使用可选属性?{a:number;b?:string}

3.5、接口

对象类型多次使用,使用接口(interface)描述对象,进行复用

(1)interface关键字声明接口

(2)接口名称,任意合法变量名

(3)直接使用接口名称作为变量类型

接口

对比:interface(接口)与type(类型别名)

相同:都可以给对象指定类型

不同:interface只能为对象指定类型,type可以为任意类型指定别名(声明用=)

继承:如果两个接口有相同的属性方法时使用集成来实现复用

继承

3.6、元组

如坐标数组,使用numbe[]不严谨,使用元组[number,number]

确切知道包含了多少元素,以及元素类型

3.7、类型推论

ts中在某些没有明确指出类型的地方,ts的类型推论机制会帮助提供类型(类型注解可以省略不写)

常见场景:1.声明变量并初始化时,2.决定函数返回值时

如果声明变量没有立即初始化,则必须添加类型注解

3.8、类型断言

指定更具体的类型

~as关键字 ~关键字as后面是一个更加具体的类型

as

使用<>语法,这种语法形式不常用:(与react语法冲突)

不常用

(console.dir)

3.9、字面量类型

字面量

变量(let)可以是任意字符串,所以类型为string

常量(cosnt)值不能变化,所以类型为KKKK

KKKK就是一个字面量类型

任意的js字面量(例如对象、数字)都可以作为字面量类型( let a:18 = 18 )

使用场景:表示一组明确的可选值列表。如:

字面量类型配合联合类型

3.10、枚举

类似字面量类型+联合类型组合的功能,也可表示一组明确的可选值

定义一组命名常量

~使用enum关键字定义枚举。~约定枚举名称、枚举中的值用大写字母开头。~,逗号分隔。~直接使用。

枚举

~枚举成员是有值的,默认:从0开始自增的数值

枚举成员为数字的枚举称为:数字枚举(存在自增长行为)

给枚举成员初始化值


初始化值

枚举成员都是字符串的称为:字符串枚举

字符串枚举中每个成员都必须要有初始值(不存在自增长行为)

设置枚举

枚举不仅作为类型,还提供值(枚举成员都是有值的)。其他类型会在编译成js是自动移除,但是枚举会被编译成js代码

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

3.11、any类型

不推荐使用,当值为any类型时,可以对改值进行任意操作,并且不会有代码提示

其他隐式具有any类型情况:1 声明变量不提供类型也不提供默认值  2 函数参数不加类型

4、typeof

可以在类型上下文中引用变量或属性的类型(类型查询)。

使用场景:根据已有变量的值,获取该值的类型,来简化类型书写

typeof

typeof出现在类型注解的位置,所处环境就在类型上下文

只能查询变量或属性的类型,无法查询其他形式的类型(如:函数调用)

你可能感兴趣的:(三、ts常用类型)