软件开发札记 · 持续修订

菜单
TypeScript

TypeScript 类型系统实践指南

用类型收窄、泛型与可辨识联合提升前端代码的可维护性。

2026年7月25日1 分钟阅读160

TypeScript 类型系统实践指南

TypeScript 的价值不是“让代码通过检查”,而是在设计阶段把非法状态排除在系统之外。

从 unknown 开始

外部数据应先视为 unknown,经过验证后再进入业务域。

parse-user.ts
type User = { id: string; name: string };
 
export function isUser(value: unknown): value is User {
  if (!value || typeof value !== "object") return false;
  return "id" in value && "name" in value;
}

可辨识联合

可辨识联合非常适合表示异步请求状态。

remote-data.ts
type RemoteData<T> =
  | { status: "idle" }
  | { status: "loading" }
  | { status: "success"; data: T }
  | { status: "error"; error: Error };

泛型边界

泛型应该表达调用方真正拥有的自由度,并通过约束保留实现所需的信息。

function getId<T extends { id: string }>(value: T) {
  return value.id;
}

总结

优先让类型呈现业务含义。类型越接近领域语言,重构时提供的反馈就越有价值。