javascript - 如何使用特定的键子集键入对象字段的值？

Question

我有一个包含多种类型值的对象:

interface Foo {
  id: number;
  data: FooData;
  username: string;
  notes: string;
}

const foo: Foo = {
  ...
}

我有一个需要字符串的函数，并且正在迭代对象中要在该函数中使用的特定字段列表，所有这些字段都包含字符串值:

const renderString = (value: string) => {
  ...
}

const fooKeys: keyof Foo = ["username", "notes"];

fooKeys.map((key) => {
  renderString(foo[key])
}

问题是 foo[key] 可以是 string、number 或 FooData 对象，所以我想指定 foo[key] 只能是 Foo 的字段值，其键与 fooKeys 中的键匹配，因为它们是全部都是字符串值。

我们可以将 foo[key] 断言为字符串，但这并不能保护我们免受 fooKeys 中的错误 key 的影响。

Answer 1

一种选择是使用条件类型仅允许 string 属性，因为这似乎是唯一允许的？例如:

type StringPropsOnly<T> = {
  [Key in keyof T]: T[Key] extends string ? Key : never;
}[keyof T]

const fooKeys: StringPropsOnly<Foo>[] = ["username", "notes"];

fooKeys.map((key) => {
  renderString(foo[key])
});

TypeScript Playground