如何从TypeScript接口获取键对应值类型并定义关联类型

你遇到的问题根源在于：泛型参数K仅默认设为keyof MyInterface，但未明确约束它必须是MyInterface的合法键，TypeScript类型系统无法确保索引操作的安全性。以下两种方法可以解决这个问题：

方法一：给泛型添加明确约束 #

通过extends keyof MyInterface约束K的取值范围，让TypeScript确认K是MyInterface的有效键：

// 先补充示例接口定义
interface SomeOtherInterface {}

interface MyInterface {
  'key1': number | string;
  'key2': string;
  'key3': SomeOtherInterface;
}

type MyType<K extends keyof MyInterface = keyof MyInterface> = {
  key: K;
  value: MyInterface[K];
  somethingElse: string;
};

使用示例：

// 正确：value自动匹配number | string类型
const item1: MyType<'key1'> = { key: 'key1', value: 123, somethingElse: 'demo' };
// 正确：value自动匹配string类型
const item2: MyType<'key2'> = { key: 'key2', value: 'hello', somethingElse: 'demo' };
// 不指定泛型时，value为所有属性类型的联合
const item3: MyType = { key: 'key3', value: {}, somethingElse: 'demo' };

方法二：直接生成键值对应联合类型 #

如果不需要灵活指定单个键的泛型，只想得到所有合法键值组合的联合类型，可以用映射类型实现：

type MyType = {
  [K in keyof MyInterface]: {
    key: K;
    value: MyInterface[K];
    somethingElse: string;
  }
}[keyof MyInterface];

这种方式下，MyType等价于三种具体类型的联合：

// 等价于：
// { key: 'key1', value: number | string, somethingElse: string } |
// { key: 'key2', value: string, somethingElse: string } |
// { key: 'key3', value: SomeOtherInterface, somethingElse: string }

// 使用时会自动做类型校验
const validItem = { key: 'key1', value: 'abc', somethingElse: 'test' }; // 符合类型
const invalidItem = { key: 'key2', value: 123, somethingElse: 'test' }; // 类型报错

两种方法按需选择：需要灵活指定单个键时用方法一，只需要固定联合类型时用方法二。

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