Home > Web Front-end > JS Tutorial > body text

How to efficiently group objects in an array by multiple properties and summarize their values?

Barbara Streisand
Release: 2024-11-08 15:53:02
Original
223 people have browsed it

How to efficiently group objects in an array by multiple properties and summarize their values?

Efficient Object Grouping with Multiple Properties in Arrays

The task of grouping objects in arrays can extend beyond a single property; in certain instances, multiple properties need to be considered for grouping. In this scenario, a customized approach is required.

Let's tackle the problem of grouping objects based on shape and color. The objective is to group objects with identical shape and color, while summing up their used and instances values.

Expected Behavior:

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 expectedResult = [
  { 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 }
];
Copy after login

Key Considerations:

  • Identify unique combinations of shape and color properties.
  • Summarise the used and instances values for objects with identical combinations.

Solution:

Leveraging Array#reduce, we can iterate through the array while maintaining a helper object to track shape-color combinations.

For each object:

  • Construct a unique key based on the shape and color properties.
  • If the key is not found in the helper object:

    • Create a new object as a copy of the current object.
    • Add it to the helper object.
    • Include it in the result array.
  • If the key is already in the helper object:

    • Increment used and instances values for the existing object in the helper object.

This process effectively groups objects with identical shape and color while accumulating their values.

Code Snippet:

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 }
];

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

  if (!helper[key]) {
    helper[key] = Object.assign({}, o);
    r.push(helper[key]);
  } else {
    helper[key].used += o.used;
    helper[key].instances += o.instances;
  }

  return r;
}, []);

console.log(result);
Copy after login

The output is consistently correct, matching the expected 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 }
]
Copy after login

By utilising this technique, you can efficiently group and sum up values based on multiple properties, empowering you to handle complex data manipulation tasks in arrays.

The above is the detailed content of How to efficiently group objects in an array by multiple properties and summarize their values?. For more information, please follow other related articles on the PHP Chinese website!

source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Latest Articles by Author
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template