JavaScript中如何按对象键分组对象数组并合并生成新数组

核心逻辑通过Array.reduce()完成分组累加，同分组键的对象属性合并后，再将临时映射对象转为最终数组即可。

完整实现代码 #

// 示例原始数组
const originArr = [
    {
        "date": "2020-12-31T18:30:00.000Z",
        "value": 450
    },
    {
        "date": "2020-12-31T18:30:00.000Z",
        "value2": 362
    },
    {
        "date": "2020-12-31T18:30:00.000Z",
        "value3": 699
    },
    {
        "date": "2021-03-01T18:30:00.000Z",
        "value": 269
    },
    {
        "date": "2021-03-01T18:30:00.000Z",
        "value2": 450
    },
    {
        "date": "2021-03-02T18:30:00.000Z",
        "value3": 841
    },
    {
        "date": "2021-04-03T18:30:00.000Z",
        "value": 700
    },
]

/**
 * 按指定键分组合并数组对象
 * @param {Array} arr 原始对象数组
 * @param {String} groupKey 用来分组的对象键名
 * @returns {Array} 分组合并后的新数组
 */
const groupMergeByKey = (arr, groupKey) => {
  // 生成以分组键值为key的临时映射对象
  const groupMap = arr.reduce((accumulator, currentItem) => {
    const currentGroupValue = currentItem[groupKey]
    // 已存在同组则合并属性，不存在则初始化当前项
    accumulator[currentGroupValue] = accumulator[currentGroupValue] 
      ? {...accumulator[currentGroupValue], ...currentItem} 
      : {...currentItem}
    return accumulator
  }, {})
  // 提取映射对象的值作为最终结果
  return Object.values(groupMap)
}

// 调用示例：按date字段分组
const result = groupMergeByKey(originArr, 'date')
console.log(result)

补充说明 #

• 同分组下存在同名属性时，默认后出现的属性值会覆盖先出现的，如有自定义合并规则可修改reduce内的合并逻辑
• 方法支持通用分组，修改第二个入参为你需要的分组字段名即可，不局限于date字段

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