TypeScript 5.x：改变代码编写方式的功能

TypeScript 继续快速发展。5.x 版本带来的变化超越了性能改进：重新定义了我们使用多年的模式。

目录

标准装饰器（TC39 Stage 3）

终于来了。经过多年的实验版本，TypeScript 5.0 采用了 TC39 的标准装饰器。语法类似但语义发生了很大变化。

// 类装饰器 — 之前（实验性）
@sealed
class OldClass { ... }

// 标准装饰器 — TS 5.x
function logged<T extends new (...args: unknown[]) => unknown>(
  target: T,
  _ctx: ClassDecoratorContext,
) {
  return class extends target {
    constructor(...args: unknown[]) {
      super(...args);
      console.log(`[LOG] ${target.name} 的实例已创建`);
    }
  };
}

@logged
class UserService {
  constructor(private db: Database) {}
}decorators.ts

方法和访问器装饰器

function measure(_target: unknown, ctx: ClassMethodDecoratorContext) {
  const name = String(ctx.name);
  return function (this: unknown, ...args: unknown[]) {
    const start = performance.now();
    const result = (this as Record<string, Function>)[name](...args); 
    const result = Reflect.apply(
      _target as Function,
      this,
      args 
    ); 
    console.log(`${name} 耗时 ${performance.now() - start}ms`);
    return result;
  };
}

class ReportService {
  @measure
  async generatePDF(id: string) {
    /* ... */
  }
}method-decorator.ts

const 类型参数

之前需要在每次调用时使用 as const 来推断字面量元组。现在你可以在泛型中声明它：

// 之前: 推断为 string[]
function head<T>(arr: T[]) {
  return arr[0];
}
head(["a", "b"]); // 类型: string

// 现在: 推断为精确的字面量
function head<const T extends readonly unknown[]>(arr: T) {
  return arr[0];
}
head(["a", "b"] as const); // 类型: "a"
head(["a", "b"]); // 类型: "a"  ← 无需 as const 也能工作const-type-params.ts

satisfies 操作符（已稳固）

在 4.9 中引入，但现在已经成为日常流程的一部分。允许验证一个值满足类型而不”拓宽”它：

type Palette = {
  red: [number, number, number] | string;
  green: [number, number, number] | string;
  blue: [number, number, number] | string;
};

const palette = {
  red: [255, 0, 0],
  green: "#00ff00",
  blue: [0, 0, 255],
} satisfies Palette; 

// 现在 TypeScript 知道 red 是元组，不是字符串
palette.red.at(0); // ✓ — 之前会报错satisfies.ts

infer 推断改进

// 按约束过滤提取返回类型
type ReturnIfString<T> = T extends () => infer R extends string
  ? R
  : never;

type A = ReturnIfString<() => "hello">; // "hello"
type B = ReturnIfString<() => number>;  // neverinfer-extends.ts

性能：--incremental 和 --composite 模式

TS 5.x 优化了增量构建。在大型项目中改进可达 3×：

{
  "compilerOptions": {
    "composite": true,
    "incremental": true,
    "tsBuildInfoFile": ".tsbuildinfo",
    "moduleResolution": "bundler"
  }
}tsconfig.json

提示： 将 composite 与项目引用（references）结合用于 monorepos。每个包只编译变化的部分。

快速摘要