Typescript 联合类型 (四)

联合类型

联合类型(Union Types) 表示取值可以为多种类型中的一种

简单的例子

• 例子 1:

let myFavoriteNumber = string | number

myFavoriteNumber = 'seven'

myFavoriteNumber = 7

• 例子 2:

let myFavoriteNumber: string | number
myFavoriteNumber = true

// index.ts(2,1): error TS2322: Type 'boolean' is not assignable to type 'string | number'.
//   Type 'boolean' is not assignable to type 'number'.

访问联合类型的属性或者方法

当 Typescript 不确定一个联合类型到底是哪个类型的时候，我们只能访问此联合类型的所有类型的共同的属性或者方法

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

// index.ts(2,22): error TS2339: Property 'length' does not exist on type 'string | number'.
//   Property 'length' does not exist on type 'number'.

上例中 length 不是 string 和 number 的共有属性,所以会报错

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

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

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

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 被推断成 string,访问它的 length 属性不会报错

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