TypeScript Union

TypeScript Union是一种复合类型，用于定义一个可以为多个类型之一的类型。在TypeScript中，一个Union类型使用"|"符号分隔每个类型。

let value: string | number;

上面的代码将value定义为一个可以是字符串或数字的Union类型。

使用场景

Union类型可以在以下场景中非常有用：

1. 接受多种类型的参数

function printId(id: string | number) {
  console.log(`ID is ${(typeof id === 'string') ? id.toUpperCase() : id}`);
}

printId('abc123'); // ID is ABC123
printId(123); // ID is 123

上面的代码中，printId函数接受一个字符串或数字类型的参数id。函数中使用了Union类型，使得函数可以处理不同类型的参数。

2. 表示可选属性或方法

interface User {
  name: string;
  age?: number;
  sayHello?(): void;
}

let user1: User = { name: 'Alice' };
let user2: User = { name: 'Bob', age: 30 };
let user3: User = { name: 'Eve', sayHello: () => console.log('Hello!') };

上面的代码中，User接口使用了Union类型。age和sayHello属性分别使用了Union类型和函数类型作为可选属性和方法。

注意事项

当使用Union类型时，需要特别注意以下几点：

1. Union类型只能使用"|"符号分隔每个类型，不能使用逗号。

let value: string, number; // 错误

2. 当使用Union类型时，只能使用每个类型的共有属性和方法。

function printLength(strOrArr: string | any[]) {
  console.log(strOrArr.length); // 错误，Array类型没有length属性
}

printLength('hello'); // 5
printLength([1, 2, 3]); // TypeError: strOrArr.length is not a function

3. 当使用多个Union类型时，需要谨慎处理类型兼容性。

let value: string | number;
let strValue: string = value; // 错误，number类型不能赋值给string类型

结论

TypeScript Union类型是一种非常有用的类型，可以处理多种类型的数据。但在使用时需要谨慎处理类型兼容性和共有属性方法。