如何从TypeScript字典的值生成联合类型？

问题 #

我有如下代码：

const myDict = {
  a: "Foo",
  b: "Bar"
} as const;

我希望基于myDict得到类型type MyType = "Foo" | "Bar"。我知道数组的情况可以这样实现：

const myList = ["Foo", "Bar"];

// 成功得到联合类型
type MyType = typeof myList[number]

但不知道如何不通过循环字典生成数组的方式，直接从字典的值得到该联合类型。

解决方案 #

你可以通过typeof结合keyof的索引访问来实现，无需生成数组，具体代码如下：

const myDict = {
  a: "Foo",
  b: "Bar"
} as const;

// 最终得到类型 "Foo" | "Bar"
type MyType = typeof myDict[keyof typeof myDict];

原理说明 #

1. typeof myDict 获取到myDict的字面量类型：{ readonly a: "Foo"; readonly b: "Bar"; }
2. keyof typeof myDict 提取该类型所有键的联合类型："a" | "b"
3. 用这个键的联合类型索引typeof myDict，就能得到对应值的联合类型："Foo" | "Bar"

注意：必须保留as const断言，它会让TypeScript把对象值推断为精确的字面量类型，而不是宽泛的string类型，这样才能生成预期的联合类型。

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