首页 > web前端 > js教程 > 如何在 JavaScript 中按多个属性和聚合值对对象进行分组?

如何在 JavaScript 中按多个属性和聚合值对对象进行分组?

Mary-Kate Olsen
发布: 2024-11-09 06:07:02
原创
1024 人浏览过

How to Group Objects by Multiple Properties and Aggregate Values in JavaScript?

按多个属性对对象进行分组并聚合值

在按多个属性对数组中的对象进行分组的任务中,一个常见的要求是不仅可以按这些属性进行分组,还可以对某些对象属性的值进行求和。然而,简单地将所有重复项嵌套在二维数组中的解决方案是不够的。

问题陈述

考虑一个必须按形状分组的对象数组,并且颜色。仅当该数组中的对象的形状和颜色相同时,才会将其视为重复对象。对于重复的对象,我们需要总结它们的使用值和实例值,并删除重复项,从而得到具有独特形状和颜色的简洁对象列表。

解决方案

为了有效解决这个问题,我们可以利用 Array#reduce 方法结合跟踪遇到的形状和颜色的辅助对象组合:

const arr = [
  { shape: 'square', color: 'red', used: 1, instances: 1 },
  { shape: 'square', color: 'red', used: 2, instances: 1 },
  { shape: 'circle', color: 'blue', used: 0, instances: 0 },
  { shape: 'square', color: 'blue', used: 4, instances: 4 },
  { shape: 'circle', color: 'red', used: 1, instances: 1 },
  { shape: 'circle', color: 'red', used: 1, instances: 0 },
  { shape: 'square', color: 'blue', used: 4, instances: 5 },
  { shape: 'square', color: 'red', used: 2, instances: 1 },
];

const helper = {};
const result = arr.reduce((r, o) => {
  const key = `${o.shape}-${o.color}`;

  if (!helper[key]) {
    // If it's a unique combination, add to the helper and result array
    helper[key] = Object.assign({}, o);
    r.push(helper[key]);
  } else {
    // If it's a duplicate, update the values in the helper
    helper[key].used += o.used;
    helper[key].instances += o.instances;
  }

  return r;
}, []);

console.log(result);
登录后复制

输出:

[
  { shape: "square", color: "red", used: 5, instances: 3 },
  { shape: "circle", color: "red", used: 2, instances: 1 },
  { shape: "square", color: "blue", used: 11, instances: 9 },
  { shape: "circle", color: "blue", used: 0, instances: 0 }
]
登录后复制

此解决方案有效地按形状和颜色对对象进行分组,聚合重复对象的使用值和实例值,以及删除所有剩余的重复项,从而得到所需的输出。

以上是如何在 JavaScript 中按多个属性和聚合值对对象进行分组?的详细内容。更多信息请关注PHP中文网其他相关文章!

来源:php.cn
本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
作者最新文章
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板