如何为支持多对象或对象数组的mergeObjects函数添加TypeScript类型

要支持mergeObjects({}, {}, {})和mergeObjects([{}, {}, {}])两种调用形式，最直接的方案是使用TypeScript函数重载，结合自定义类型推导合并后的对象类型。

完整实现代码 #

// 自定义类型：递归合并对象数组中的所有对象类型，后续对象会覆盖前面对象的同名键类型
type MergeObjects<T extends object[]> = T extends [infer First, ...infer Rest]
  ? First extends object
    ? Rest extends object[]
      ? Omit<MergeObjects<Rest>, keyof First> & First
      : First
    : MergeObjects<Rest>
  : {};

// 函数重载声明：明确两种参数形式的类型约束
function mergeObjects<T extends object[]>(...sources: T): MergeObjects<T>;
function mergeObjects<T extends object[]>(sources: T): MergeObjects<T>;

// 函数实现逻辑
function mergeObjects(...sources: any[]) {
  let objectsToMerge: object[];
  // 统一处理两种参数输入形式
  if (Array.isArray(sources[0])) {
    objectsToMerge = sources[0];
  } else {
    objectsToMerge = sources;
  }
  // 执行对象合并
  return objectsToMerge.reduce((acc, obj) => ({ ...acc, ...obj }), {});
}

代码说明 #

1. MergeObjects类型：通过递归遍历对象数组，将所有对象的类型合并，确保类型推导和函数的实际合并逻辑一致（后传入的对象键会覆盖前面对象的同名键）。
2. 函数重载：
   • 第一个重载对应多独立对象参数的调用形式mergeObjects({}, {}, {})。
   • 第二个重载对应单对象数组参数的调用形式mergeObjects([{}, {}, {}])。
3. 实现逻辑：内部通过判断首个参数是否为数组，将两种输入形式统一转换为待合并的对象数组，再执行合并操作。

调用示例 #

// 调用方式1：多个独立对象参数
const result1 = mergeObjects({ a: 1 }, { b: "2" }, { c: true });
// result1类型自动推导为：{ a: number; b: string; c: boolean }

// 调用方式2：单个对象数组参数
const result2 = mergeObjects([{ x: "hello" }, { y: 3 }, { z: null }]);
// result2类型自动推导为：{ x: string; y: number; z: null }

内容的提问来源于stack exchange，提问作者Islam Y-