TypeScript Academy · 课时

TypeScript 5.3-5.4：新的收窄功能与 NoInfer

Q: 「TypeScript 5.3-5.4：新的收窄功能与 NoInfer」这节课中我会学到什么？

应用 NoInfer 工具类型以及新的 switch/case 收窄功能 你通过在浏览器中直接运行的动手代码来练习 TypeScript Academy，全天候 AI 导师会在你学习这节课的过程中回答你的问题。

应用 NoInfer 工具类型以及新的 switch/case 收窄功能

第 3 / 4 课13 个步骤

TypeScript 5.3-5.4：新的收窄功能与 NoInfer 是 CoddyKit 上的免费 TypeScript Academy 课时。这是第 3 节课，共 4 节。你可以在下方免费阅读本课时的完整内容 — 然后在浏览器中使用内置代码编辑器和全天候 AI 导师进行实践。这是 TypeScript Academy 学习路径的一部分，你的进度在网页和 CoddyKit 应用中同步。 TypeScript Academy 课程共包含 4 节课。

TypeScript 5.3 概览

TypeScript 5.3（于 2023 年 11 月发布）改进了 switch/case 语句的类型收窄，增加了 JSDoc 导入类型支持，并支持在 import type 中指定解析模式。

// npm install typescript@5.3

Switch/Case 类型收窄改进

TS 5.3 改进了 switch 语句中的类型收窄，尤其适用于包含多个 case 的可辨识联合类型。

type Result = { status: "ok"; data: string } | { status: "err"; code: number };

function handle(r: Result) {
  switch (r.status) {
    case "ok":
      console.log(r.data);   // r: { status: "ok"; data: string } — narrowed
      break;
    case "err":
      console.log(r.code);   // r: { status: "err"; code: number } — narrowed
      break;
  }
}

JSDoc import type

TS 5.3 增加了对 @import JSDoc 标签的支持，用于在 JavaScript 文件中执行仅类型导入。

/** @import { User } from "./types.js" */

/** @param {User} user */
function greet(user) {
  console.log(user.name);
}

import type 中的 resolution-mode

TS 5.3 允许在 import type 中指定 resolution-mode，以控制导入解析为 CommonJS 还是 ESM。

import type { User } from "some-library" with { "resolution-mode": "require" };

TypeScript 5.4 概览

TypeScript 5.4（于 2024 年 3 月发布）引入了 NoInfer 工具类型，在闭包中保留类型收窄，并增加了 Object.groupBy 和 Map.groupBy 类型。

// npm install typescript@5.4

NoInfer<T> 工具类型

NoInfer 会阻止 TypeScript 将泛型参数用作推断位置，强制仅从其他参数推断类型。

function createStore<T>(initial: T, onChange: (val: NoInfer<T>) => void) {
  // T inferred from initial, not from onChange callback
}

createStore({ count: 0 }, (val) => {
  // val: { count: number } — inferred from initial only
});

NoInfer 的重要性

没有 NoInfer 时，TypeScript 会尝试从两个参数推断 T，这可能会意外拓宽类型。

// Before NoInfer: T may be widened by the callback
function createStore<T>(initial: T, onChange: (val: T) => void) {}
createStore({ count: 0 }, (val: { count: number; extra: string }) => {});
// T widened to include extra — not what we want

闭包之后保留类型收窄

当类型收窄后的变量在闭包之后没有被赋值时，TS 5.4 会在闭包中保留类型收窄结果。

function process(val: string | null) {
  if (!val) return;
  // val: string
  setTimeout(() => {
    console.log(val.toUpperCase()); // TS 5.4: still string — not widened
  }, 100);
}

Object.groupBy 类型

TS 5.4 为 ES2024 的 Object.groupBy 和 Map.groupBy 静态方法添加了类型。

const users = [
  { name: "Alice", role: "admin" },
  { name: "Bob", role: "user" },
];
const grouped = Object.groupBy(users, (u) => u.role);
// grouped: { [role: string]: { name: string; role: string }[] }

改进声明文件生成

TS 5.4 改进了复杂情况下的声明文件生成，这些情况涉及映射类型和条件类型，并减少了生成的 .d.ts 文件中的误报。

// Fewer "Type ... is not assignable to type ..." errors
// in generated declaration files from TS 5.4 onward

回顾：TS 5.3–5.4

TS 5.3：改进 switch/case 类型收窄，支持 JSDoc @import。TS 5.4：使用 NoInfer 阻止不需要的类型推断位置，保留闭包中的类型收窄，并增加 Object.groupBy 类型。

快速检查

NoInfer 会阻止什么？

在交互式课程中回答

您学到的内容

TS 5.3 改进了 switch/case 类型收窄，并增加了 JSDoc 导入类型。TS 5.4 引入 NoInfer 来控制推断位置，在闭包之间保留类型收窄，并为 ES2024 增加了 Object.groupBy 类型。

免费开始

用 AI 导师学习 TypeScript — 免费

在浏览器中编写并运行真实代码，获得全天候 AI 导师的即时帮助，并在网页或应用中继续学习。

课程: 101
课程: 352

免费开始学习查看完整课程

常见问题解答

「TypeScript 5.3-5.4：新的收窄功能与 NoInfer」课时是免费的吗？

是的 — 「TypeScript 5.3-5.4：新的收窄功能与 NoInfer」的完整文本可在网页上免费阅读。要进行交互式练习（内置代码编辑器和全天候 AI 导师）并解锁 TypeScript Academy 课程的其余内容，请升级到 CoddyKit PRO。 TypeScript Academy 课程共包含 4 节课。

「TypeScript 5.3-5.4：新的收窄功能与 NoInfer」这节课中我会学到什么？

应用 NoInfer 工具类型以及新的 switch/case 收窄功能你通过在浏览器中直接运行的动手代码来练习 TypeScript Academy，全天候 AI 导师会在你学习这节课的过程中回答你的问题。

学习 TypeScript Academy 需要有经验吗？

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

「TypeScript 5.3-5.4：新的收窄功能与 NoInfer」课时需要多长时间？

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

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

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

此课程中的所有课时

← 返回 TypeScript Academy