如何在TypeScript中将对象类型转换为键值对数组的联合类型？

嘿，这个需求我之前也碰到过，用TypeScript的映射类型就能完美解决，还能保证键和对应的值类型严格匹配，不会出现乱组合的情况。直接上解决方案：

type MyObject = {
  foo: 'bar'
  baz: 'qux'
}

// 定义一个通用的转换类型
type ObjectToKeyValuePairs<T> = {
  [K in keyof T]: [K, T[K]]
}[keyof T]

// 得到你想要的目标类型
type MyKeyValuePair = ObjectToKeyValuePairs<MyObject>
// 此时 MyKeyValuePair 就是 ['foo', 'bar'] | ['baz', 'qux']，完全符合你的要求！

我给你拆解下这段代码的逻辑：

• 首先{ [K in keyof T]: [K, T[K]] }是映射类型，它会遍历输入对象类型T的每一个键K，把每个键转换成一个键值对数组类型。比如对MyObject来说，这个映射后的中间类型是{ foo: ['foo', 'bar'], baz: ['baz', 'qux'] }。
• 然后我们用[keyof T]去索引这个中间类型，相当于把它的所有值类型提取出来，组成一个联合类型。这样就得到了每个键对应值的数组联合，而且每个数组的键和值是严格绑定的，不会出现['foo', 'qux']这种错误组合。

如果你的对象里有可选属性，比如：

type MyObjectWithOptional = {
  foo: 'bar'
  baz?: 'qux'
}

默认转换后会包含['baz', undefined]的情况，如果想移除这种可选属性带来的undefined，可以给映射类型加上-?标记来移除可选性：

type ObjectToKeyValuePairs<T> = {
  [K in keyof T]-?: [K, T[K]]
}[keyof T]

type MyKeyValuePairOptional = ObjectToKeyValuePairs<MyObjectWithOptional>
// 此时结果就是 ['foo', 'bar'] | ['baz', 'qux']

备注：内容来源于stack exchange，提问作者andershagbard