0Pricing
TypeScript Academy · 课时

联合类型与字面量类型（基础类型收窄简介）

使用联合类型组合不同类型，使用字面量类型表示精确值，并应用基础的类型收窄。

联合类型与字面量类型（基础类型收窄简介） 是 CoddyKit 上的免费 TypeScript Academy 课时。 这是第 3 节课，共 3 节。 你可以在下方免费阅读本课时的完整内容 — 然后在浏览器中使用内置代码编辑器和全天候 AI 导师进行实践。 这是 TypeScript Academy 学习路径的一部分，你的进度在网页和 CoddyKit 应用中同步。 TypeScript Academy 课程共包含 3 节课。

简介

目标：学习如何使用 union 组合多种类型，并使用字面量类型限制值。这些功能有助于创建更安全的 API。

联合类型基础

联合类型使用 | 来允许多种类型中的一种。在这里，它表示字符串或数字。

let value: string | number;
value = "hello";

value = 42;

// value = true; 
// Error, not allowed

字面量类型

字面量类型会将值限制为精确的选项。它们常用于配置和枚举。

let direction: "left" | "right";
direction = "left";

// direction = "up";
 // Error

类型收窄基础

类型收窄会检查运行时类型（例如 typeof），以便安全地访问成员。

function printId(id: string | number) {
  if (typeof id === "string") {
    console.log(id.toUpperCase());
  } else {
    console.log(id.toFixed(2));
  }
}

printId("abc");
printId(123.456);

判别联合类型

判别联合类型将字面量标签与对象结合起来。根据 kind 进行类型收窄，可以让 TypeScript 更智能地工作。

type Shape =
  | { kind: "circle"; radius: number }
  | { kind: "square"; size: number };

function area(shape: Shape): number {
  if (shape.kind === "circle") {
    return Math.PI * shape.radius ** 2;
  } else {
    return shape.size * shape.size;
  }
}

console.log(area({ kind: "circle", radius: 2 }));
console.log(area({ kind: "square", size: 3 }));

联合类型与字面量类型的作用

为什么使用联合类型和字面量类型？它们可以排除无效状态、引导自动补全，并让编译器更早发现错误。

联合类型检查

快速检查：什么是联合类型？

回顾

回顾：使用 | 表示联合类型，使用字面量类型表示精确值，并通过类型收窄安全地进行分支处理。这些工具让 TS 更具表现力，也更安全。

常见问题解答

「联合类型与字面量类型（基础类型收窄简介）」课时是免费的吗？

是的 — 「联合类型与字面量类型（基础类型收窄简介）」的完整文本可在网页上免费阅读。要进行交互式练习（内置代码编辑器和全天候 AI 导师）并解锁 TypeScript Academy 课程的其余内容，请升级到 CoddyKit PRO。 TypeScript Academy 课程共包含 3 节课。

「联合类型与字面量类型（基础类型收窄简介）」这节课中我会学到什么？

使用联合类型组合不同类型，使用字面量类型表示精确值，并应用基础的类型收窄。 你通过在浏览器中直接运行的动手代码来练习 TypeScript Academy，全天候 AI 导师会在你学习这节课的过程中回答你的问题。

学习 TypeScript Academy 需要有经验吗？

无需任何先前经验。CoddyKit 上的 TypeScript Academy 课程适合初学者到高级学习者，你可以从这里开始或从头开始，按照自己的节奏学习。 这是第 3 节课，共 3 节。

「联合类型与字面量类型（基础类型收窄简介）」课时需要多长时间？

大多数 CoddyKit 课程大约需要 5–10 分钟。每节课都很精短且互动，所以你能稳步进步，并在网页和应用中从离开的地方继续。

我能在这节 TypeScript Academy 课中编写并运行代码吗？

能。每节 TypeScript Academy 课都包含内置代码编辑器，你可以在浏览器中直接编写并运行真实代码，并获得即时 AI 反馈 — 无需本地设置。

此课程中的所有课时

  1. 基本类型与类型注解
  2. 类型推断与 any 和 unknown 的区别
  3. 联合类型与字面量类型（基础类型收窄简介）
← 返回 TypeScript Academy