如何在TypeScript中使用keyof时限定对应值的类型？

当然可以实现这个约束，核心思路是通过条件类型筛选出目标对象中值类型为string的键，再用这些键约束泛型K的范围。

解决方案代码 #

先定义工具类型提取对象中值为string的键，再修改原接口：

// 提取T中所有值类型为string的键
type StringKeys<T> = {
  [P in keyof T]: T[P] extends string ? P : never
}[keyof T];

// 修改后的泛型接口
interface SearchListProps<T extends object, K extends StringKeys<T>> {
  data: T[];
  sort_and_filter_key: K;
}

原理说明 #

• StringKeys<T> 遍历T的所有键P：如果T[P]是string类型则保留该键，否则返回never；最后通过[keyof T]取所有有效键的联合类型。
• 接口中K被约束为StringKeys<T>的子集，确保sort_and_filter_key只能传入T中值为string的键。

验证示例 #

合法用法

interface Test {
  a: string, 
  b: number,
  c: object
}

// 合法："a"是Test中值为string的键
const objectB: SearchListProps<Test, "a"> = {
  data: [{ a: "as", b: 1, c: {} }],
  sort_and_filter_key: "a"
}

非法用法（编译报错）

// 报错："b"对应number类型，不属于StringKeys<Test>
const objectA: SearchListProps<Test, "b"> = {
  data: [{ a: "as", b: 1, c: {} }],
  sort_and_filter_key: "b"
}

额外优化：自动推导泛型 #

如果不想显式传入K的类型，可利用TypeScript类型推导结合satisfies关键字自动校验：

// 自动推导K为"a"，编译通过
const objectC = {
  data: [{ a: "as", b: 1, c: {} }],
  sort_and_filter_key: "a"
} satisfies SearchListProps<Test, any>;

// 编译报错："b"不符合值为string的约束
const objectD = {
  data: [{ a: "as", b: 1, c: {} }],
  sort_and_filter_key: "b"
} satisfies SearchListProps<Test, any>;

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