跳到主要内容

TypeScript 字符串字面量类型

介绍​

在 TypeScript 中，字符串字面量类型是一种特殊的类型，它允许你将变量的值限制为特定的字符串。与普通的 string 类型不同，字符串字面量类型只能接受预先定义好的字符串值。这种类型在需要精确控制变量值的场景中非常有用，例如处理 API 响应、配置选项或状态管理等。

通过使用字符串字面量类型，你可以让 TypeScript 在编译时检查代码中的潜在错误，从而提高代码的健壮性和可维护性。

基本用法​

字符串字面量类型的定义非常简单，你只需要将具体的字符串值作为类型即可。例如：

typescript
type Direction = "left" | "right" | "up" | "down";

function move(direction: Direction) {
    console.log(`Moving ${direction}`);
}

move("left");  // 正确
move("up");    // 正确
move("north"); // 错误：类型“"north"”的参数不能赋给类型“Direction”的参数

在上面的例子中，Direction 类型被定义为只能接受 "left"、"right"、"up" 或 "down" 这四个字符串值。如果你尝试传递其他字符串值，TypeScript 会在编译时报错。

提示

字符串字面量类型通常与联合类型（|）一起使用，以定义一组允许的字符串值。

实际应用场景​

1. 处理 API 响应​

假设你正在开发一个应用程序，需要处理来自 API 的不同状态响应。你可以使用字符串字面量类型来确保状态值的正确性：

typescript
type ApiStatus = "success" | "error" | "loading";

function handleResponse(status: ApiStatus) {
    switch (status) {
        case "success":
            console.log("Data fetched successfully!");
            break;
        case "error":
            console.error("An error occurred.");
            break;
        case "loading":
            console.log("Loading data...");
            break;
    }
}

handleResponse("success"); // 正确
handleResponse("pending"); // 错误：类型“"pending"”的参数不能赋给类型“ApiStatus”的参数

在这个例子中，ApiStatus 类型确保了 handleResponse 函数只能处理预定义的三种状态值，从而避免了潜在的错误。

2. 配置选项​

字符串字面量类型也常用于定义配置选项。例如，假设你有一个函数，允许用户选择不同的日志级别：

typescript
type LogLevel = "debug" | "info" | "warn" | "error";

function log(message: string, level: LogLevel) {
    console[level](message);
}

log("This is a debug message", "debug"); // 正确
log("This is a critical message", "critical"); // 错误：类型“"critical"”的参数不能赋给类型“LogLevel”的参数

通过使用字符串字面量类型，你可以确保 log 函数只接受有效的日志级别。

与联合类型的结合​

字符串字面量类型通常与联合类型结合使用，以定义一组允许的字符串值。例如：

typescript
type TrafficLight = "red" | "yellow" | "green";

function changeLight(color: TrafficLight) {
    console.log(`Changing light to ${color}`);
}

changeLight("red");    // 正确
changeLight("blue");   // 错误：类型“"blue"”的参数不能赋给类型“TrafficLight”的参数

在这个例子中，TrafficLight 类型限制了 changeLight 函数只能接受 "red"、"yellow" 或 "green" 作为参数。

总结​

字符串字面量类型是 TypeScript 中一种强大的工具，它允许你将变量的值限制为特定的字符串。通过使用字符串字面量类型，你可以在编译时捕获潜在的错误，从而提高代码的类型安全性和可读性。

在实际开发中，字符串字面量类型常用于处理 API 响应、配置选项、状态管理等场景。它与联合类型的结合使用，可以进一步增强代码的健壮性。

附加资源与练习​

  • 练习 1: 定义一个名为 Weekday 的字符串字面量类型，包含一周的七天。然后编写一个函数 getDayMessage，根据传入的 Weekday 类型参数返回不同的消息。
  • 练习 2: 使用字符串字面量类型定义一个 UserRole 类型，包含 "admin"、"editor" 和 "viewer" 三种角色。然后编写一个函数 checkPermission，根据用户角色返回不同的权限级别。
备注

如果你对字符串字面量类型还有疑问，建议查阅 TypeScript 官方文档或尝试在 TypeScript Playground 中编写代码进行实验。