TypeScript 高级类型技巧实战

1. 条件类型

根据条件选择不同的类型：

type IsString<T> = T extends string ? true : false;

type A = IsString<string>;  // true
type B = IsString<number>;  // false

2. 映射类型

批量修改对象属性：

// 将所有属性变为可选
type Partial<T> = {
  [K in keyof T]?: T[K];
};

// 将所有属性变为只读
type Readonly<T> = {
  readonly [K in keyof T]: T[K];
};

3. 工具类型组合

// 提取某些字段
type Pick<T, K extends keyof T> = {
  [P in K]: T[P];
};

interface User {
  id: number;
  name: string;
  email: string;
  password: string;
}

type PublicUser = Pick<User, "id" | "name">;
// { id: number; name: string; }

4. 索引访问类型

interface ApiResponse {
  data: {
    user: {
      name: string;
      age: number;
    };
  };
}

type UserName = ApiResponse["data"]["user"]["name"];
// string

5. 推断类型 (infer)

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

function getUser() {
  return { id: 1, name: "John" };
}

type User = ReturnType<typeof getUser>;
// { id: number; name: string; }

6. 模板字面量类型

type HttpMethod = "GET" | "POST" | "PUT" | "DELETE";
type Endpoint = "/users" | "/posts";

type ApiRoute = `${HttpMethod} ${Endpoint}`;
// "GET /users" | "POST /users" | ...

7. 实用场景

深度 Partial

type DeepPartial<T> = {
  [K in keyof T]?: T[K] extends object ? DeepPartial<T[K]> : T[K];
};

排除特定类型

type FilterNonNull<T> = T extends null | undefined ? never : T;

type Result = FilterNonNull<string | null | undefined>;
// string

函数参数类型提取

type FirstParameter<T> = T extends (arg: infer P, ...rest: any[]) => any ? P : never;

8. 类型守卫

function isString(value: unknown): value is string {
  return typeof value === "string";
}

if (isString(input)) {
  // input 被推断为 string
  input.toUpperCase();
}

最佳实践

1. 优先使用接口: 可合并，适合对象形状
2. 类型别名: 适合联合类型、复杂类型
3. 避免 any: 使用 unknown 更安全
4. 利用类型推断: 不要过度标注
5. 泛型约束: 使用 extends 限制泛型

总结

掌握这些高级类型技巧，能写出更安全、更灵活的 TypeScript 代码。实践是关键，多在项目中应用。