TypeScript泛型部分推断：如何传参并推断另一类型？

要实现无需手动指定泛型、自动推断对应类型，同时避免暴露响应式state对象的需求，可以通过基于房间ID的类型映射优化TypeScript类型定义，具体步骤如下：

1. 定义房间状态的类型映射 #

先明确不同房间ID对应的状态类型，让TypeScript能通过房间ID自动关联到对应的状态结构：

type A = {
  value: string;
  number: number;
};

// 定义所有房间ID与对应状态类型的映射
type RoomStateMap = {
  test: A;
  // 可添加其他房间的状态类型，比如：
  // chat: { messages: string[]; unread: number };
};

// 确保roomStateMap实例的类型与上述映射一致
const roomStateMap = new Map<keyof RoomStateMap, RoomStateMap[keyof RoomStateMap]>();
type UnsubscribeFunction = () => void;

2. 优化subscribe函数的泛型定义 #

调整泛型参数，让TypeScript通过传入的roomId自动推断对应的状态类型，进而约束key和回调参数的类型：

function subscribe<RoomId extends keyof RoomStateMap>(
  roomId: RoomId,
  key: keyof RoomStateMap[RoomId],
  callback: (state: RoomStateMap[RoomId][typeof key]) => void
): UnsubscribeFunction {
  const targetState = roomStateMap.get(roomId);
  if (!targetState) throw new Error(`Room ${roomId} not found`);

  return subscribeKey(targetState, key, callback);
}

3. 使用方式 #

现在调用subscribe时无需手动指定泛型，TypeScript会自动完成类型推断，且不会出现“展示所有可能类型”的问题：

// 自动推断callback参数为string
subscribe("test", "value", (isAString) => console.log(isAString));
// 自动推断callback参数为number
subscribe("test", "number", (isANumber) => console.log(isANumber));

核心优势 #

• 自动类型推断：无需手动传入泛型参数，TypeScript通过roomId自动关联对应状态类型
• 类型安全：key被限制为当前房间状态的合法键，回调参数类型严格匹配对应键的值类型
• 避免状态篡改：用户无法直接获取响应式state对象，只能通过订阅回调获取值，从根源上防止非法修改

内容的提问来源于stack exchange，提问作者ScreamZ