什么是联合类型
在 TypeScript 中，联合类型是指具有两种或多种可能类型的变量类型。它允许我们将一个变量定义为多种不同类型的选项之一。
例如，一个变量可以是数字或布尔值。我们可以使用联合类型来定义这个变量类型。
定义联合类型
要定义一个联合类型，我们可以使用 | 符号将所有可能的类型连接起来。
let variable: number | boolean;
上面的代码将 variable 定义为一个可以存储数字或布尔值的变量。
我们也可以使用 type 关键字定义联合类型。
type MyType = string | number;
上面的代码定义了一个名为 MyType 的联合类型，它可以存储字符串或数字。
使用联合类型
当我们定义了一个联合类型后，我们可以在代码中使用它。
例如，如果我们有一个函数，它可以接受字符串或数字作为参数，我们可以使用联合类型来定义它的参数类型。
function myFunction(parameter: string | number) {
// 函数体
}上面的代码定义了一个名为 myFunction 的函数，它可以接受一个字符串或数字作为参数。
我们也可以在变量声明中使用联合类型。
let myVariable: number | boolean = true; myVariable = 5;
上面的代码将 myVariable 定义为一个可以存储数字或布尔值的变量，并将它的值设置为 true。
深入理解联合类型
在 TypeScript 中，联合类型可以让我们更精确地描述代码中的值。但是，如果不小心使用联合类型，它可能会导致一些问题。
首先，当我们使用联合类型时，我们必须记住变量可以是多种不同类型之一。这意味着我们必须检查每个变量的类型，以确定可以执行哪些操作。
但是，在某些情况下，我们不希望使用所有可能的类型。例如，如果我们有一个变量，它可以是数字或字符串，但我们只需要使用数字，我们怎么办？
在这种情况下，我们可以使用类型断言。类型断言是指告诉 TypeScript 变量的确切类型。这样，我们就可以使用该变量的所有操作，而不必担心它可能是其他类型。
function myFunction(parameter: string | number) {
if (typeof parameter === 'number') {
// 执行数字操作
} else {
// 执行字符串操作
}
}上面的代码在调用 myFunction 函数时，根据传入的参数类型执行不同的操作。我们使用 typeof 操作符检查参数的类型，并使用类型断言来告诉 TypeScript 该参数是数字。
总结
在 TypeScript 中，联合类型可以让我们更精确地描述代码中的值。我们可以使用 | 符号或 type 关键字定义联合类型，用于变量声明和函数参数类型。
但是，我们必须谨慎地使用联合类型，以避免出现问题。在某些情况下，我们可以使用类型断言来告诉 TypeScript 该变量的确切类型。这样，我们就可以使用该变量的所有操作，而不必担心它可能是其他类型。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/64740fe6968c7c53b017ff71