TypeScript - 字面量类型

2024-05-21 14:43:30 浏览数 (2)

在 TypeScript 中，字面量类型（Literal Types）是指那些与特定字面量值严格对应的类型。字面量类型包括字符串字面量类型、数字字面量类型和布尔字面量类型。使用字面量类型可以提高代码的准确性和可读性，因为它们限制变量只能赋值为特定的字面量。

字符串字面量类型

字符串字面量类型用于定义一个只能是特定字符串值的变量。

代码语言：javascript复制
type EventType = "click" | "mouseover" | "keydown";
const eventType: EventType = "click";

在这个例子中，EventType 是一个字符串字面量类型，它只能是 "click"、"mouseover" 或 "keydown" 中的一个。

数字数面量类型

数字字面量类型用于定义一个只能是特定数字值的变量。

代码语言：javascript复制
type StatusCode = 200 | 301 | 404 | 500;
const status: StatusCode = 200;

在这个例子中，StatusCode 是一个数字字面量类型，它只能是 200、301、404 或 500 中的一个。

布尔字面量类型

布尔字面量类型用于定义一个只能是布尔值 true 或 false 的变量。

代码语言：javascript复制
type BooleanValue = true | false;
const isReady: BooleanValue = false;

在这个例子中，isReady 变量只能被赋值为 true 或 false。

使用场景

字面量类型在定义枚举类型的替代品、限制字符串或数字只能为特定值时非常有用。它们也常用于类型守卫中，以确保变量的值符合预期。

代码语言：javascript复制
interface User {
  name: string;
  onlineStatus: "online" | "offline";
}

function printUserStatus(user: User) {
  if (user.onlineStatus === "online") {
    console.log(`${user.name} is online.`);
  } else {
    console.log(`${user.name} is offline.`);
  }
}

在这个例子中，onlineStatus 字段使用了一个字符串字面量类型，它限制了 onlineStatus 只能是 "online" 或 "offline"。

与 enum 的异同

字面量类型（Literal Types）和枚举（Enums）在 TypeScript 中都用于限制变量的取值范围，但它们之间存在一些区别。让我们来看看它们的异同，并通过例子加以说明。

相同之处：

  1. 1. 限制取值范围： 字面量类型和枚举都用于限制变量的取值范围，确保变量只能取特定的值。
  2. 2. 增强可读性： 它们都可以使代码更易读，因为它们充当了一种语义化的标记，说明变量的含义。

不同之处：

  1. 1. 定义方式：
    • • 字面量类型： 字面量类型使用字面量直接定义变量的取值，例如 'success' | 'failure'。
    • • 枚举： 枚举使用标识符（identifier）来定义变量的取值，例如 enum Status { Success, Failure }。
  2. 2. 类型形式：
    • • 字面量类型： 字面量类型是一种类型，可以与其他类型组合使用，如联合类型，交叉类型等。
    • • 枚举： 枚举本身就是一种类型，枚举成员是唯一的标识符，但枚举类型本身也是一种类型。
  3. 3. 可扩展性：
    • • 字面量类型： 字面量类型不易扩展。一旦定义了字面量类型，就只能使用其中的值。
    • • 枚举： 枚举是可以扩展的。你可以向枚举中添加新的成员。

示例：

使用字面量类型：
代码语言：javascript复制
type Status = 'success' | 'failure';

function logStatus(status: Status) {
  console.log(`Status: ${status}`);
}

logStatus('success'); // 合法
logStatus('failure'); // 合法
// logStatus('error'); // 不合法，只能是 'success' 或 'failure'
使用枚举：
代码语言：javascript复制
enum Status {
  Success,
  Failure,
}

function logStatus(status: Status) {
  console.log(`Status: ${status}`);
}

logStatus(Status.Success); // 合法
logStatus(Status.Failure); // 合法
// logStatus('error'); // 不合法，只能是 Status.Success 或 Status.Failure

在这个示例中，Status 被限制为 'success' 或 'failure' 两个字面值或 Status.Success 和 Status.Failure 两个枚举成员。使用字面量类型和枚举都能实现相同的效果，但具体选择取决于需求和个人偏好。通常来说，如果变量的取值是固定且不可扩展的，字面量类型更合适；如果需要一组有序的标识符，并且可能会扩展，枚举更为适用。

注意事项

  • • 字面量类型是 TypeScript 的基本类型之一，它们提供了一种方式来定义更精确的类型。
  • • 字面量类型通常用于小型、固定的值集合，例如状态码、错误码或特定的配置选项。
  • • 字面量类型可以与联合类型结合使用，以创建一个可以是多个特定字面量值的类型。

通过使用字面量类型，你可以提高代码的类型安全性，减少运行时错误，并使代码的意图更加清晰。

typescript status 变量 配置 字符串

0 人点赞