TypeScript 索引类型：keyof 与 T[K]

TypeScript 的类型系统功能强大，其中索引类型（Index Types）是处理动态属性访问的核心工具。keyof 和 T[K] 这两个操作符配合使用，能够实现类型安全的属性读取、对象约束以及灵活的泛型编程。本文将深入讲解这两个操作符的原理和实际应用。

1. 索引类型的核心概念

在 TypeScript 中，当我们不确定一个对象有哪些属性，或者需要编写一个函数来处理任意类型的对象时，索引类型就显得尤为重要。传统的类型定义方式要求我们预先知道所有属性名，这在处理动态数据结构时往往力不从心。

索引类型提供了一种方式来描述类型的"键"和"值"之间的关系，使得类型系统能够追踪和验证属性访问的合法性。

2. keyof 操作符：获取类型的所有键

2.1 基本用法

keyof 是一个类型操作符，用于获取一个类型的所有属性名组成的联合类型。它的语法非常简洁：

interface Person {
  name: string;
  age: number;
  email: string;
}

// keyof Person 的结果是 "name" | "age" | "email"
type PersonKeys = keyof Person;

// 1. 字符串索引签名的情况
interface StringMap {
  [key: string]: number;
}

// keyof StringMap 的结果是 string
type StringMapKeys = keyof StringMap;

// 2. 数字索引签名的情况
interface ArrayLike {
  [index: number]: string;
}

// keyof ArrayLike 的结果是 number
type ArrayLikeKeys = keyof ArrayLike;

2.2 关键特性

keyof 总是返回类型的字面量键名联合，而非具体的 string 或 number 类型：

interface Config {
  debug: boolean;
  theme: string;
}

type ConfigKeys = keyof Config;  // "debug" | "theme"

function getProperty<T, K extends keyof T>(obj: T, key: K): T[K] {
  return obj[key];
}

const config: Config = { debug: true, theme: "dark" };

// K 被约束为 "debug" | "theme"，不能传入非法的属性名
getProperty(config, "debug");   // 正确
getProperty(config, "theme");   // 正确
getProperty(config, "invalid"); // 编译错误

3. T[K] 索引访问类型

3.1 基本概念

T[K] 称为索引访问类型（Index Access Type） 或查找类型（Lookup Type），用于获取对象类型中指定键对应的值类型：

interface ApiResponse {
  status: number;
  data: { id: number; name: string };
  message: string;
}

// 获取 status 属性的类型
type ResponseStatus = ApiResponse["status"];  // number

// 获取 data 属性的类型
type ResponseData = ApiResponse["data"];      // { id: number; name: string }

3.2 结合 keyof 使用

将 keyof 和 T[K] 结合，可以实现批量获取值类型的功能：

interface Product {
  id: number;
  name: string;
  price: number;
  description: string;
}

type ProductPropertyTypes = Product[keyof Product];
// 等价于：Product["id" | "name" | "price" | "description"]
// 结果为：number | string | number | string
// 化简后为：number | string

3.3 多级嵌套访问

T[K] 支持链式访问，可以深入对象内部获取嵌套属性的类型：

interface Company {
  address: {
    street: string;
    city: string;
    zipCode: number;
  };
  employee: {
    name: string;
    department: string;
  };
}

// 获取 address 的类型
type AddressType = Company["address"];
// { street: string; city: string; zipCode: number }

// 获取 address 中 street 的类型
type StreetType = Company["address"]["street"];  // string

4. 实际应用场景

4.1 类型安全的属性获取函数

keyof 和 T[K] 最常见的应用是编写泛型工具函数：

/**
 * 获取对象指定属性的值
 * T: 对象类型
 * K: 必须是 T 的某个键
 */
function getPropertyValue<T, K extends keyof T>(
  obj: T,
  key: K
): T[K] {
  return obj[key];
}

const user = {
  id: 1,
  username: "alice",
  isAdmin: true,
};

// TypeScript 自动推断返回类型
const id = getPropertyValue(user, "id");           // number
const username = getPropertyValue(user, "username"); // string
const isAdmin = getPropertyValue(user, "isAdmin");   // boolean

4.2 只读属性映射

利用 keyof 可以创建原类型的只读版本：

type Readonly<T> = {
  readonly [P in keyof T]: T[P];
};

interface Settings {
  theme: string;
  notifications: boolean;
  language: string;
}

type FrozenSettings = Readonly<Settings>;
// 等价于：
// {
//   readonly theme: string;
//   readonly notifications: boolean;
//   readonly language: string;
// }

// 尝试修改会报错
const settings: FrozenSettings = { theme: "dark", notifications: true, language: "zh" };
// settings.theme = "light"; // 编译错误：Cannot assign to 'theme' because it is a read-only property

4.3 部分属性类型

提取部分属性的类型组成新的对象类型：

interface FullState {
  loading: boolean;
  data: User[];
  error: string | null;
  lastUpdated: Date;
}

// 只取 loading 和 data 相关的类型
type LoadingState = Pick<FullState, "loading" | "data">;

// 实现
type Pick<T, K extends keyof T> = {
  [P in K]: T[P];
};

// 使用
const initialState: LoadingState = {
  loading: false,
  data: [],
};

4.4 排除特定属性

从类型中排除某些属性：

interface User {
  id: number;
  username: string;
  password: string;  // 敏感信息
  email: string;
  createdAt: Date;
}

// PublicUser 不包含密码等敏感信息
type PublicUser = Omit<User, "password">;

// 实现
type Omit<T, K extends keyof T> = {
  [P in Exclude<keyof T, K>]: T[P];
};

// 结果为：{ id: number; email: string; createdAt: Date; username: string }

5. 高级用法

5.1 联合类型与索引类型

当 K 是联合类型时，T[K] 也会返回对应的联合类型：

interface Engine {
  horsepower: number;
  torque: number;
  fuelType: "gasoline" | "diesel" | "electric";
}

type PerformanceMetrics = Engine["horsepower" | "torque"];  // number

type FuelOptions = Engine["fuelType"];  // "gasoline" | "diesel" | "electric"

5.2 映射类型中的索引类型

keyof 在映射类型中发挥核心作用：

type Getters<T> = {
  [K in keyof T as `get${Capitalize<string & K>}`]: () => T[K];
};

interface State {
  count: number;
  message: string;
  active: boolean;
}

// 自动生成 getter 类型
type StateGetters = Getters<State>;
/*
结果为：
{
  getCount: () => number;
  getMessage: () => string;
  getActive: () => boolean;
}
*/
```

### 5.3 条件类型与索引类型结合

```typescript
type BooleanKeys<T> = {
  [K in keyof T]: T[K] extends boolean ? K : never;
}[keyof T];

interface FormConfig {
  isRequired: boolean;
  maxLength: number;
  pattern: string;
  disabled: boolean;
}

type BooleanConfigKeys = BooleanKeys<FormConfig>;
// 结果为："isRequired" | "disabled"
```

---

## 6. 常见陷阱与注意事项

### 6.1 可选属性与必填属性

通过 `T[K]` 获取的类型会保留可选性：

```typescript
interface User {
  name: string;
  age?: number;  // 可选属性
}

type UserAge = User["age"];  // number | undefined
```

### 6.2 只读属性

通过 `T[K]` 获取的类型会保留只读性：

```typescript
interface Config {
  readonly apiUrl: string;
}

type ConfigApiUrl = Config["apiUrl"];  // string（不保留 readonly）
```

如需保留只读性，需要使用映射类型：

```typescript
type Readonly<T> = {
  readonly [P in keyof T]: T[P];
};

type ReadonlyApiUrl = Readonly<Config>["apiUrl"];  // readonly string
```

### 6.3 索引签名的情况

带有索引签名的类型需要特别注意：

```typescript
interface Record<string, unknown> {
  [key: string]: unknown;
}

type StringKey = Record<string, unknown>["key"];  // unknown
type AllKeys = Record<string, unknown>[keyof Record<string, unknown>];  // unknown
```

---

## 7. 完整示例：类型安全的表单更新

```typescript
interface FormState {
  username: string;
  email: string;
  password: string;
  rememberMe: boolean;
}

type FormFieldType<T, K extends keyof T> = T[K];

// 验证函数：根据字段类型返回不同的验证逻辑
function validateField<K extends keyof FormState>(
  field: K,
  value: FormState[K]
): boolean {
  switch (field) {
    case "email":
      return /^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(value as string);
    case "password":
      return (value as string).length >= 8;
    case "rememberMe":
      return typeof value === "boolean";
    default:
      return true;
  }
}

// 更新表单字段的类型安全函数
function updateForm<K extends keyof FormState>(
  state: FormState,
  field: K,
  value: FormState[K]
): FormState {
  return {
    ...state,
    [field]: value,
  };
}

总结

keyof 和 T[K] 是 TypeScript 类型系统中两个基础但强大的操作符。keyof 用于获取类型的键集合，而 T[K] 用于通过键获取对应的值类型。两者结合可以实现：

掌握这两个操作符，是进阶到 TypeScript 高阶类型编程的关键一步。