ThinkChat🤖让你学习和工作更高效,注册即送10W Token,即刻开启你的AI之旅 广告
[TOC] >[success] # 类型推论 联合类型和 类型断言 本章的名字看着非常的拗口,感觉很难理解,其实不是的,只是这 **3** 个东西非常适合在一起讲解。 >[success] ## 类型推论 从上一章,我们讲过,**当我们把一个变量赋值一个函数时,变量会自动获取数据的类型,鼠标指向变量时就可以看到变量的类型,这是因为类型推论的原则,它可以推断出我们赋值的过程中,这个变量,它应该是一个什么类型的** ,举个例子: 我们 **定义一个普通的变量,不定义类型,它也不会报错** **basic-types.ts** ~~~ let str = 'str' ~~~ 但是一旦赋值成 **number 类型** 时就会报错 ![](https://img.kancloud.cn/26/ae/26ae791917212013b9f1c39d3dcb116c_455x115.png) 因为 **Typescript** 在 **没有明确指定类型时,会推测出一个类型** ,这就是我们所说的 **类型推论** ,算是 **Typescript** 为我们提供的一个帮助。 >[success] ## 联合类型 我们倒回去说一下 **any 类型** ,**any** 是一个大而全的 **类型** ,不到万不得已,不会使用它,但是现在还有一种情况,它的 **类型范围** 不是特别广泛,只允许 **一部分类型** , **比如说一个变量可以是 string 、number ,其他类型则不行** ,这种时候我们可以使用 **联合类型** **basic-types.ts** ~~~ // 联合类型 let numberOrString: number | string numberOrString = 'abc' numberOrString = 123 ~~~ >[success] ## 类型断言 上面的代码中 **numberOrString** 这个 **变量** 有 **2** 种 **类型** ,既可以是 **number** 也可以是 **string** ,所以在编译器中打 **numberOrString.** 时,**它会自动弹出 字符串与数字提供的一些方法,但是有一些方法它不会弹出来,例如:字符串是有 length 这个属性的** , **鼠标指向变量时, length 没有弹出来**,这个时候我们就需要使用 **类型断言** ,**Typescript 断言:用来告诉编译器,你比它更了解这个类型,并且它不应该再发出错误** ,这时候我们可以使用 **as 关键字,告诉编译器,你无法判断我的代码,但是我本人很清楚** **basic-types.ts** ~~~ // 类型断言 function getLength(input:string | number):number { const str = input as string if(str.length){ return str.length } else { const number = input as number return number.toString().length } } ~~~ 注意: **类型断言** 不是 **类型转换** ,把它 **断言成联合类型中不存在的类型会出错的** 。 当 **遇到联合类型时,使用条件语句可以自动帮你缩小类型的范围** **basic-types.ts** ~~~ // type guard function getLength2(input:string | number):number { if(typeof input === 'string'){ return input.length } else { return input.toString().length } } ~~~