Typescript 将对象数组映射到一个合并的对象类型类型声明答案

【问题标题】：Typescript map Array of objects to one merged object type type declarationTypescript 将对象数组映射到一个合并的对象类型类型声明
【发布时间】：2021-10-24 09:47:00
【问题描述】：

我有一个这样的对象数组

const barDependency = {
  defaults: {
    size: {
      bar: {
        foo: 12,
        bar: {
          default: 12,
          active: 12
        }
      }
    },
    color: {}
  }
}

还有一个像这样的原始对象：

const theme = {
   size: {
     m: '12px'
   }
}

应该合并两者的函数应该将barDependency.defaults.size中的所有内容放入theme.size.components中这个函数的逻辑很简单，但是 TS 无法推断输出，所以我决定自己用 TS mapped types 声明 ReturnType，如下所示：

const stitchTheme = <
  T extends RawTheme,
  D extends ThemeDependency[] = ThemeDependency[],
  A extends number = number
>(
  dependencies: D,
  options?: StitchThemeOptions
): T & {
  size: T['size'] & {
    components?: {
      [Key in KeysOfUnion<
        D[A]['defaults']['size']
      >]: D[A]['defaults']['size'][Key]
    }
  }
}

问题是即使泛型指向相同的数字，我也无法通过数组中的索引访问给定对象的值。 size.components.bar 的值将是 unknown。有没有办法正确解决这个问题？

KeysOfUnion 类型供参考type KeysOfUnion<T> = T extends T ? keyof T : never

【问题讨论】：

标签： typescript types mapped-types

【解决方案1】：

经过一番研究，我发现了这篇文章：https://dev.to/lucianbc/union-type-merging-in-typescript-9al

其中将解释如何通过使用自定义实用程序类型来实现合并对象联合：

type AllKeys<T> = T extends any ? keyof T : never
type PickType<T, K extends AllKeys<T>> = T extends { [k in K]: any }
  ? T[K]
  : undefined
type PickTypeOf<T, K extends string | number | symbol> = K extends AllKeys<T>
  ? PickType<T, K>
  : never
type Merge<T extends object> = {
  [k in AllKeys<T>]: PickTypeOf<T, k>
}

【讨论】：