typeScript-联合类型

联合类型

联合类型表示取值可以取设定多种类型中的一种。

let myFavoriteNum:string|number
myFavoriteNum = 'seven'
myFavoriteNum = 7
myFavoriteNum = true
//  TS2322: Type 'boolean' is not assignable to type 'string | number'.

联合类型使用|分隔符来分隔每个类型

上面代码说明let myFavoriteNum:string|number说明myFavoriteNum可以为string何number类型,但是不能为其他类型

访问联合类型的属性和方法

当TypeScript不确定一个联合类型的变量到底是那个类型的时候,我们只能访问此联合类型的所有类型里共有的属性和方法。

function getLength(something:string|number) {
  return something.length
}
// Property 'length' does not exist on type 'string | number'.
  // Property 'length' does not exist on type 'number'.

上述代码中,length不属于string和number的共有属性,所以会报错

访问string和number的共有属性是没有问题的

function getLength(something:string|number) {
  return something.toString()
}

联合类型的变量在被赋值的时候,会根据类型推论的规则来推断出来一个类型

let myFavoriteNum:string|number
myFavoriteNum = 'seven'
console.log(myFavoriteNum.length)
myFavoriteNum = 7
console.log(myFavoriteNum.length)
 // ERROR in :Property 'length' does not exist on type 'number'.

上例中,第二行的 myFavoriteNumber 被推断成了 string,访问它的 length 属性不会报错。

而第四行的 myFavoriteNumber 被推断成了 number,访问它的 length 属性时就报错了。

posted @ 2021-06-17 14:08  upupupupupgo  阅读(96)  评论(0编辑  收藏  举报