如何从对象数组生成TypeScript联合类型？

问题原因 #

你用array.map结合const断言失败，是因为map返回的是运行时动态创建的新数组，不属于const断言允许的字面量、枚举成员等引用范畴，所以无法直接对其使用断言。我们需要从原始数组的类型层面提取精确的字面量联合类型。

解决方案 #

1. 给原始数组添加const断言，锁定字面量类型

先让TypeScript精确推断数组中每个name的具体字面量值，而非宽泛的string类型：

const names = [
  { name: 'Bob' },
  { name: 'Jane' },
  { name: 'John' },
  { name: 'Mike' },
] as const;

2. 提取目标联合类型

通过typeof获取数组的类型，再用索引访问语法提取所有name字段的字面量值，组成联合类型：

type NameType = typeof names[number]['name'];
// 最终得到类型：'Bob' | 'Jane' | 'John' | 'Mike'

3. 实现带智能提示的getName函数

将NameType作为函数的参数或返回值类型，IntelliSense就会自动提示数组中的可用名称：

function getName(name: NameType): NameType {
  return name;
}

// 调用时会自动弹出提示：Bob、Jane、John、Mike
getName('Bob');

可选：生成运行时名称数组 #

如果需要在运行时获取所有名称的数组，同时保留精确类型，可以基于断言后的原始数组生成：

const nameList = names.map(item => item.name) as readonly NameType[];
// nameList的类型为 readonly ['Bob', 'Jane', 'John', 'Mike']

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