TypeScript 类型体操实战：从泛型到条件类型

前言

TypeScript 的类型系统异常强大，甚至图灵完备。本文系统讲解高级类型技巧。

一、泛型进阶

function pick<T, K extends keyof T>(obj: T, keys: K[]): Pick<T, K> {
  const result = {} as Pick<T, K>;
  keys.forEach(k => result[k] = obj[k]);
  return result;
}

二、条件类型

type IsString<T> = T extends string ? true : false;
type A = IsString<"hello">;  // true
type B = IsString<42>;       // false

三、映射类型

type Mutable<T> = {
  -readonly [K in keyof T]: T[K];
};

type Optional<T> = {
  [K in keyof T]?: T[K];
};

四、模板字面量类型

type EventName = `on${Capitalize<string>}`;
// onClick, onMouseDown, onKeyUp, ...

五、infer 关键字

type ReturnType<T> = T extends (...args: any[]) => infer R ? R : never;
type PromiseType<T> = T extends Promise<infer U> ? U : T;

六、实战：类型安全的路由

type Route = `/users/${number}` | `/articles/${number}`;
function navigate(route: Route) { ... }
navigate("/users/1");     // OK
navigate("/users/abc");  // Error

总结

TypeScript 类型系统是工程利器，掌握后能写出更安全、更可维护的代码。