JavaScript如何使用reduce方法实现数组按日期分组求和

直接用reduce按日期分组累加即可，完整代码如下：

const array = [
  { date: '2022-06-29', cost: 3.874886 },
  { date: '2022-06-28', cost: 3.357631 },
  { date: '2022-06-28', cost: 92.24 },
  { date: '2022-06-28', cost: 221.47 },
  { date: '2022-06-28', cost: 164.8 },
  { date: '2022-06-29', cost: 263.58 },
  { date: '2022-06-29', cost: 30.19 },
  { date: '2022-06-29', cost: 3.72 }, 
  { date: '2022-11-29', cost: 33.19 },
  { date: '2022-11-01', cost: 31.72 }
]

const sumResult = Object.values(
  array.reduce((tempMap, currentItem) => {
    // 初始化当前日期的累加记录
    if (!tempMap[currentItem.date]) {
      tempMap[currentItem.date] = { date: currentItem.date, cost: 0 }
    }
    // 累加同日期的cost
    tempMap[currentItem.date].cost += currentItem.cost
    return tempMap
  }, {})
)

// 如需按日期升序排列，追加排序逻辑
sumResult.sort((a, b) => new Date(a.date) - new Date(b.date))

运行结果 #

执行后得到的正确输出如下，你给出的期望结果里第二条的date存在笔误，实际应为2022-06-29：

[
  { date: '2022-06-28', cost: 481.867631 },
  { date: '2022-06-29', cost: 301.364886 },
  { date: '2022-11-01', cost: 31.72 },
  { date: '2022-11-29', cost: 33.19 }
]

逻辑说明 #

• 给reduce传入空对象作为初始累加值，遍历过程中以date为key存储各日期的累加cost
• 每遍历到一条数据，先检查临时对象中是否存在对应日期的记录，不存在则初始化cost为0
• 遍历完成后通过Object.values()提取临时对象的所有值，就是分组求和后的数组
• 如果对输出顺序有要求，可以追加排序逻辑，默认输出顺序和原数组中各日期第一次出现的顺序保持一致

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