【TS】联合类型--类型断言--类型推断

联合类型

在实际开发中，我们接收的变量可能不是一个固定的数据类型，而是动态的多个数据类型，此时用单个固定的数据类型去接收很明显是不行的，为了解决这种可能会接收多个不同数据类型的变量就需要用到联合类型。联合类型表示取值可以为多种类型中的一种。
语法：let 变量名 : 数据类型 | 数据类型2 = 值

let str : string | number = '世界现代设计史'
 console.log(str);  // 世界现代设计史
 str = 100
 console.log(str);  // 100
//  str = true   // 报错
1
2
3
4
5

在函数中使用联合类型

// 该函数可以传入数字类型和字符串类型，返回值为字符串类型
const getString = (str:number|string):string =>{
    // return str  // 打印100 报错 返回的类型必须是字符串
    return str.toString()  // 转字符串，返回字符串类型
}
console.log(getString(100));
1
2
3
4
5
6

---

类型断言

类型断言也就是告诉编译器，我知道自己是什么类型，也知道自己在干什么。
类型断言的语法：
1、<类型>变量名 (val)
2、变量名 as 类型 (val as number[])

类型断言也就是在编译的时候断定这个值是什么类型的，如果是的话就做什么操作。

let val : number[] = [100,200,300]  
// 如果val存在，那么它是一个数组类型的，输出val.length  
console.log((val as number[]).length);   // 打印 3
1
2
3

可以通过类型断言来做对应的操作，比如遍历一个数组：

let val : number[] = [100,200,300]  
// 如果val存在，那么它是一个数组，遍历数组
(<number[]>val).forEach(el=>{
    console.log(el);   // 打印 100,200,300
})
1
2
3
4
5

类型断言可以多重嵌套，比如双重类型断言
如果 val 存在，那么它是any类型的，如果val存在并且是any类型的，它则是number[]类型的，打印数组的长度

console.log(((val as any) as number[]).length);
// 打印 3
1
2

---

类型推断

类型推断： 在没有明确指定类型的时候，推测出一个类型。
声明一个变量，这个变量没有定义数据类型，系统会根据变量的值自动推断它是什么类型，并且以此类型为规范。

// 在没有明确指定类型的时候推测出一个类型
let txt = 100    // 推断 number类型
// txt = '东方不败' // 赋值 string类型 报错
console.log(txt);  // 打印 100
1
2
3
4

如果声明的变量没有赋值，那么这个变量为any类型，any类型的变量可以是任何数据类型。

let txt2   // 变量声明了没赋值 any类型
txt2 = 200
txt2 = '世界现代设计史'
console.log(txt2);
1
2
3
4

---

案例源码：https://gitee.com/wang_fan_w/ts-seminar

如果觉得这篇文章对你有帮助，欢迎点亮star