联合类型
联合类型(Union Types)表示取值可以为多种类型中的一种。
看例子:
ts:
//联合类型
let unionnTypes : string | number;
unionnTypes = 888;
unionnTypes = '999';
unionnTypes = false;
当我们编译这个ts文件的时候会报错,
Type ‘false’ is not assignable to type ‘string | number’.
说明,这个unionnTypes 只能是字符串类型或者是数值类型,被赋值其他类型会报错。
特点:使用 | 分隔每个类型;
例如:
let unionnTypes : string | number;
unionnTypes 只能是字符串或者是数值类型。
当联合类型被用做参数时:
//联合类型
const fun = (uZjq:string |number)=>{
console.log(uZjq);
}
这个时候可以使用的方法或者属性需要时string和number共有的。例如:
//联合类型
const fun = (uZjq:string |number)=>{
console.log(uZjq.length);
}
报错:
Property ‘length’ does not exist on type ‘string | number’.
Property ‘length’ does not exist on type ‘number’.
原因:
length 不是 string 和 number 的共有属性,所以会报错。
访问共有的属性是没问题的:
//联合类型
const fun = (uZjq: string | number) => {
console.log(uZjq.toString());
}
因为你可能是字符串类型可能是数值类型,ts会都考虑到这两种情况会不会出问题。
联合类型的变量在被赋值的时候,会根据类型推论的规则推断出一个类型:
let myFavoriteNumber: string | number;
myFavoriteNumber = 'seven';
console.log(myFavoriteNumber.length); // 5
myFavoriteNumber = 7;
console.log(myFavoriteNumber.length); // 编译时报错
// index.ts(5,30): error TS2339: Property 'length' does not exist on type 'number'.
首先myFavoriteNumber可以死字符串类型也可以是数值类型,放被赋予字符串类型,会有length属性,当再次被赋值为数值类型,没有length这个属性的时候就会报错。
参考:https://www.bookstack.cn/read/typescript-tutorial-202005/basics-union-types.md