【JS运算】分组求和/平均值（reduce函数）

且陶陶

发布于 2023-04-23 16:58:23

2.1K0

发布于 2023-04-23 16:58:23

文章被收录于专栏：Triciaの小世界

对于数组求和的问题，使用reduce函数能够最快的解决如果你还不会reduce函数，可以看这一篇： reduce函数的使用

思路

reduce函数对相同group的值进行迭代求和 将分组的总和除以组里的个数得到平均值，然后存储起来

Sum函数：

用来存储分组求和的结果。
使用了reduce方法，将数组中的元素进行迭代，并将它们按照group属性进行分组。
在每次迭代中，回调函数会将上一次迭代的结果prev和当前元素{group, value}作为参数传入。
回调函数中使用了短路运算符·||，如果prev[group]存在，则将它的值加上value，否则将它的值设为0再加上value，最后返回prev，即上一次迭代的结果。
这样就可以得到一个以group属性为键，以value属性为值的对象Sum，它存储了每个分组的总和。

getAvg函数：

用来计算每个分组的平均值。
接受一个对象x作为参数，x是分组求和的结果Sum。
在函数内部，首先定义了一个空对象item，用来存储每个分组的平均值。
然后使用Object.keys(x)方法获取x对象的所有键，即分组的名称。
接着使用map方法对每个分组进行迭代，将它的平均值计算出来，并存储到item对象中。
计算平均值的方法是将分组的总和Sum[y]除以分组中元素的个数count。最后返回item对象，它存储了每个分组的平均值。

代码

const users = [
  {
    group: 'one',
    value: 114,
  },
  {
    group: 'two',
    value: 564,
  },
  {
    group: 'one',
    value: 367,
  },
  {
    group: 'two',
    value: 219,
  },
]

// Sum
const Sum = users.reduce(
  // reduce 第一个参数是一个回调函数，第二个参数是一个初始值对象{}
  // prev是上一次迭代的结果，{group,value}是curr解构后的值，【也就是当前处理的值】
  // 通过短路运算 || ：如果prev[group]存在，则将prev[group]的值加上value，否则将prev[group]的值设为0再加上value。最后返回prev，即上一次迭代的结果
  (prev, { group, value }) => ((prev[group] = (prev[group] || 0) + value), prev),
  {}
)

console.log(Sum) //{editor: 57, admin: 56}

// Average
const getAvg = (x) => {
  const item = {}
  const count = Object.keys(x).length
  Object.keys(x).map(function (y) {
    item[y] = Sum[y] / count
  })
  return item
}
console.log(getAvg(Sum))