TypeScript 类型收窄备忘
尤利亚 10219ee912421f0b · · English · 日本語

TypeScript 类型收窄备忘

类型收窄天天用,但写法选哪个经常要想一下。

三种常见场景

// 1. 原始类型:typeof
function pad(x: string | number) {
  if (typeof x === "string") return x.padStart(8, "0");
  return String(x).padStart(8, "0");
}

// 2. 对象结构:in
function area(s: { r: number } | { w: number; h: number }) {
  if ("r" in s) return Math.PI * s.r ** 2;
  return s.w * s.h;
}

// 3. 最推荐:判别联合
type Shape =
  | { kind: "circle"; r: number }
  | { kind: "rect"; w: number; h: number };

判别联合配合 switch + never 兜底,新增类型时编译器会提醒你没处理——这是最大的好处。