0Pricing
TypeScript Academy · 课时

satisfies 与类型注解

在验证结构的同时保留字面量推断。

satisfies 与类型注解 是 CoddyKit 上的免费 TypeScript Academy 课时。 这是第 2 节课,共 4 节。 你可以在下方免费阅读本课时的完整内容 — 然后在浏览器中使用内置代码编辑器和全天候 AI 导师进行实践。 这是 TypeScript Academy 学习路径的一部分,你的进度在网页和 CoddyKit 应用中同步。 TypeScript Academy 课程共包含 4 节课。

注解模式

经典模式 const config: Type = {...} 会验证对象,但变量类型会变成 Type,从而扩大其中所有字面量的类型。

type Config = { mode: string; level: number };
const config: Config = { mode: "dark", level: 5 };
// config.mode has type string
console.log(config.mode);

扩大类型的表现

使用注解后,config.mode 是 string。您无法将它赋给一个要求字面量 "dark" 的变量。

type Config = { mode: string };
const config: Config = { mode: "dark" };
// const m: "dark" = config.mode; // Error: string not assignable to "dark"
console.log(config.mode);

satisfies 模式

使用 const config = {...} satisfies Type 时,变量会保留精确的推断类型,同时仍会根据 Type 进行检查。

type Config = { mode: string; level: number };
const config = { mode: "dark", level: 5 } satisfies Config;
// config.mode has type "dark"
console.log(config.mode);

保留精确推断

现在 config.mode 是字面量 "dark",因此它可以在任何要求窄类型的地方使用。

type Config = { mode: string };
const config = { mode: "dark" } satisfies Config;
const m: "dark" = config.mode; // OK
console.log(m);

两者都会进行验证

两种模式都会拒绝无效对象。区别只在于最终的变量类型,而不在于是否会进行验证。

type Config = { level: number };
// const a: Config = { level: "x" }; // Error
// const b = { level: "x" } satisfies Config; // Error
const ok = { level: 3 } satisfies Config;
console.log(ok.level);

可以捕获额外属性

与注解一样,satisfies 会标记目标类型中不存在的多余属性,从而帮助发现键名中的拼写错误。

type Config = { mode: string };
// const c = { mode: "dark", extar: true } satisfies Config; // Error: extar
const c = { mode: "dark" } satisfies Config;
console.log(c.mode);

保留元组特性

satisfies 与 as const 结合使用时,还能帮助数组保留类似元组的精确性,同时继续验证元素类型。

type Nums = readonly number[];
const xs = [1, 2, 3] as const satisfies Nums;
// xs is a readonly tuple [1, 2, 3], validated as numbers
console.log(xs.length);

注解会扩大联合成员

如果某个字段是类似 "a" | "b" 的联合类型,那么类型为该联合类型的注解会保留联合类型;但更宽泛的字段类型会扩大它。satisfies 会固定确切的成员。

type Config = { tier: string };
const withAnn: Config = { tier: "pro" };       // tier: string
const withSat = { tier: "pro" } satisfies Config; // tier: "pro"
console.log(withAnn.tier, withSat.tier);

读取时保留自动补全

由于 satisfies 会保留字面量键和值,编辑器可以根据确切对象进行自动补全,而不是依据更宽泛的声明类型。

type Theme = Record<string, string>;
const theme = { bg: "black", fg: "white" } satisfies Theme;
// theme.<autocomplete shows bg and fg>
console.log(theme.bg, theme.fg);

如何在两者之间选择

当您确实需要更宽泛的类型时,请使用普通注解。当您需要验证,同时还要在之后保留精确推断出的结构时,请使用 satisfies。

type Config = { mode: string };
// Want wide type for reassignment flexibility -> annotation
let a: Config = { mode: "dark" };
// Want exact literals for later indexing -> satisfies
const b = { mode: "dark" } satisfies Config;
console.log(a.mode, b.mode);

并列总结

注解会扩大类型;satisfies 会保留类型。两者都会进行验证。对于需要读取的不可变 config,satisfies 通常是更好的默认选择。

type C = { color: string; size: number };
const widened: C = { color: "red", size: 1 };
const exact = { color: "red", size: 1 } satisfies C;
console.log(widened.color, exact.color);

快速检查:satisfies 与注解

请测试您对两者区别的理解。

回顾:satisfies 与类型注解

类型注解会进行验证,但会将字面量扩大为其基础类型。satisfies 运算符既能验证,又能保留精确推断,从而保留字面量值、键和元组精确性。

type C = { mode: string };
const c = { mode: "dark" } satisfies C;
const exact: "dark" = c.mode;
console.log(exact);

常见问题解答

「satisfies 与类型注解」课时是免费的吗?

是的 — 「satisfies 与类型注解」的完整文本可在网页上免费阅读。要进行交互式练习(内置代码编辑器和全天候 AI 导师)并解锁 TypeScript Academy 课程的其余内容,请升级到 CoddyKit PRO。 TypeScript Academy 课程共包含 4 节课。

「satisfies 与类型注解」这节课中我会学到什么?

在验证结构的同时保留字面量推断。 你通过在浏览器中直接运行的动手代码来练习 TypeScript Academy,全天候 AI 导师会在你学习这节课的过程中回答你的问题。

学习 TypeScript Academy 需要有经验吗?

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

「satisfies 与类型注解」课时需要多长时间?

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

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

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

此课程中的所有课时

  1. 为什么会有 satisfies
  2. satisfies 与类型注解
  3. satisfies 与 as 断言
  4. satisfies 的实用模式
← 返回 TypeScript Academy