合并对象数组并将同key对应value归集为数组的实现方法，可使用lodash

需求说明 #

我们需要对嵌套结构的对象数组做合并，同一分类（如algo、base）下相同key对应的value会被收集为数组格式，支持数字、字符串等基础类型的value。

示例输入 #

const arr1 = [
  {
    algo: [
      { key: 'c', value: 1 },
      { key: 'java', value: 2 },
    ],
    base: [
      { key: 'js', value: 3 },
      { key: 'python', value: 4 },
    ],
  },
  {
    algo: [
      { key: 'c', value: 10 },
      { key: 'java', value: 20 },
    ],
    base: [
      { key: 'js', value: 30 },
      { key: 'python', value: 40 },
    ],
  },
]

预期输出 #

const results = [
  {
    algo: [
      { key: 'c', value: [1, 10] },
      { key: 'java', value: [2, 20] },
    ],
    base: [
      { key: 'js', value: [3, 30] },
      { key: 'python', value: [4, 40] },
    ],
  },
]

实现方案 #

方案1：基于lodash实现（代码最简洁） #

直接利用lodash的聚合、遍历能力快速实现：

const _ = require('lodash');

function mergeCategoryArrays(arr) {
  // 第一步：聚合所有分类下的所有条目
  const allCategoryEntries = _.reduce(arr, (result, currentObj) => {
    _.forIn(currentObj, (entries, category) => {
      result[category] = result[category] ? result[category].concat(entries) : entries;
    })
    return result;
  }, {});

  // 第二步：每个分类下按key分组，合并value为数组
  const mergedObj = _.mapValues(allCategoryEntries, (categoryEntries) => {
    const keyGroup = _.groupBy(categoryEntries, 'key');
    return _.map(keyGroup, (sameKeyEntries, key) => ({
      key,
      value: _.map(sameKeyEntries, 'value')
    }))
  })

  return [mergedObj];
}

// 测试调用
console.log(mergeCategoryArrays(arr1));

方案2：原生JS实现（无第三方依赖） #

如果不想引入lodash，用原生的数组方法也可以实现：

function mergeCategoryArrays(arr) {
  const categoryMap = {};

  // 聚合所有分类条目
  arr.forEach(currentObj => {
    Object.entries(currentObj).forEach(([category, entries]) => {
      if (!categoryMap[category]) categoryMap[category] = [];
      categoryMap[category].push(...entries);
    })
  })

  // 按key合并value
  const mergedObj = {};
  Object.entries(categoryMap).forEach(([category, entries]) => {
    const keyMap = {};
    entries.forEach(({key, value}) => {
      if (!keyMap[key]) keyMap[key] = [];
      keyMap[key].push(value);
    })
    mergedObj[category] = Object.entries(keyMap).map(([key, value]) => ({key, value}));
  })

  return [mergedObj];
}

// 测试调用
console.log(mergeCategoryArrays(arr1));

以上两种实现都支持任意数量的分类、任意数量的数组成员合并，value为字符串、数字等基础类型都可以正常收集。

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