TS学习笔记（Three Day）

联合类型概述

联合类型允许我们将不同类型的值存储在单个变量中，从而提供更大的灵活性。TypeScript中的联合类型可以用竖线（|）来定义。例如，我们可以定义一个变量，使其能够存储字符串或数字：

let age: string | number;

现在，我们可以将字符串或数字值赋给age变量：

age = "25";
age = 25;

使用联合类型时，我们需要特别注意的是，在对联合类型变量进行操作时，TypeScript会自动进行类型检查。如果我们尝试对联合类型变量执行与其中任何一种类型不兼容的操作，TypeScript将会报错。

联合类型应用场景

联合类型在实际项目中有很多应用场景。以下是其中几个最常见的场景：

• 处理不同类型的输入： 联合类型可以让我们更轻松地处理不同类型的输入。例如，我们可以定义一个函数，使其能够接受字符串或数字类型的参数：

function greet(name: string | number): string {
  if (typeof name === "string") {
    return "Hello, " + name + "!";
  } else {
    return "Hello, world!";
  }
}

现在，我们可以将字符串或数字值作为参数传递给greet函数，函数将根据参数的类型返回不同的问候语。

• 返回不同类型的输出： 联合类型还可以让我们更轻松地返回不同类型的输出。例如，我们可以定义一个函数，使其能够返回字符串或数字类型的返回值：

function calculateArea(shape: string | number): number | string {
  if (shape === "circle") {
    return Math.PI * Math.pow(radius, 2);
  } else if (shape === "square") {
    return Math.pow(sideLength, 2);
  } else {
    return "Invalid shape";
  }
}

现在，我们可以将字符串或数字值作为参数传递给calculateArea函数，函数将根据参数的值返回面积或错误消息。

• 类型保护： 联合类型还可以用于类型保护。类型保护是指确保在对联合类型变量进行操作之前对其类型进行检查。例如，我们可以使用typeof运算符来检查联合类型变量的类型：

if (typeof age === "string") {
  // Do something with age as a string
} else if (typeof age === "number") {
  // Do something with age as a number
}

联合类型最佳实践

在实际项目中使用联合类型时，请注意以下最佳实践：

• 保持类型窄化： 类型窄化是指将联合类型的类型范围缩小到更具体