# 类型推导

前面我们简单介绍了下TS中的基本类型,但是对于初次使用TS的用户来说明显感觉比JS繁琐很多(JS中变量不需要指定类型),难道以后每声明一个变量都需要标明类型吗?

在 TypeScript 中,不是每个地方都需要标注类型,因为类型推断允许您无需编写额外的代码即可获得大量功能。

当声明一个变量没有赋值的时候默认是any类型

const a; // any

默认在初始化的时候会进行类型推导

let str = 'name'; // str为string类型
str = 1;  // Type 'number' is not assignable to type 'string'.

# 包装对象

在使用基本数据类型时,会将原始类型包装成对象类型

// 11..toString() -> Number(11).toString()
const number1:number = 11
const number2:number = Number(11)

// 下面这样不行,不能把实例赋值给基本类型
// const number3:number = new Number(11)

// 类也是一个类型,它可以描述实例
const number4:Number = new Number(11)
const number5:Number = 11

# 联合类型

在使用联合类型时,没有赋值只能访问联合类型中共有的方法和属性

let name:string | number // 联合类型  
console.log(name!.toString()); // 公共方法
name = 10;
console.log(name!.toFixed(2)); // number方法
name = 'zf';
console.log(name!.toLowerCase()); // 字符串方法

上述代码中的 ! 表示值非空,也就是一定有值

# 类型断言

类型断言可以用来手动指定一个值的类型。类型断言有两种形式,一种是使用 as 语法,一种是使用尖括号,但是使用尖括号的写法和JSX语法有冲突,所以不建议使用这个写法。

const ele:HTMLElement | null = document.getElementById('#app')
ele!.style.color = 'red';

(ele as HTMLElement).style.color = 'red';

// 将ele强转成HTMLElement,这样写和JSX语法有冲突,尽量不要这么写
(<HTMLElement>ele).style.color = 'red';

// 双重断言,不建议使用,因为会破坏原有类型
(ele as unknown) as boolean

# 字面量类型

可以用字面量当做类型,给变量赋值时也只能采用这几个值(限定值),类似枚举。

let direction:'up'|'down'|'left'|'right'
direction = 'up'

// Type '"aaa"' is not assignable to type '"up" | "down" | "left" | "right"'
// direction = 'aaa'

如果我们还有变量 direction2、direction3...,每一个都像声明 direction 一样写未免有些麻烦,这个时候我们可以使用 type 来给类型起个别名,方便后续使用。

type Direction = 'up'|'down'|'left'|'right'
let direction2: Direction
direction2 = 'left'