ArticleZip > How To Group By And Sum An Array Of Objects Duplicate

How To Group By And Sum An Array Of Objects Duplicate

Imagine you have an array of objects in your project, and you need to group them based on a specific property and calculate the sum of another property for each group. This is a common task in software development, and fortunately, JavaScript provides a simple and efficient way to achieve this using array reduce and map methods. Let's dive into how you can easily group by and sum an array of objects with duplicate values.

To begin, let's consider an example array of objects that we will work with:

Javascript

const data = [
  { id: 1, category: 'A', value: 10 },
  { id: 2, category: 'B', value: 20 },
  { id: 3, category: 'A', value: 30 },
  { id: 4, category: 'B', value: 40 },
  { id: 5, category: 'A', value: 50 },
];

In this example, we have objects with 'category' as the property by which we want to group the objects, and 'value' as the property for which we want to calculate the sum.

We can achieve the grouping and summing by using the array reduce method in combination with the array map method. Here's how we can do it:

Javascript

const result = Object.values(data.reduce((acc, { category, value }) => {
  acc[category] = acc[category] || { category, total: 0 };
  acc[category].total += value;
  return acc;
}, {})).map(({ category, total }) => ({ category, total }));

Let's break down how this code works:

1. We use the reduce method on the 'data' array to iterate over each object.
2. Inside the reduce callback function, we check if the category already exists in the accumulator object.
3. If the category doesn't exist, we initialize it with the current category and set the initial total to 0.
4. We then increment the total value for each category as we encounter objects with the same category.
5. Finally, we use Object.values and map to transform the grouped results to an array of objects with 'category' and 'total' properties.

After running this code, the 'result' variable will contain an array of objects where each object represents a category and its corresponding total sum of values:

Javascript

// Output
[
  { category: 'A', total: 90 },
  { category: 'B', total: 60 },
]

By following this approach, you can effectively group by and sum an array of objects based on a specific property, even when dealing with duplicate values. This method provides a clean and concise solution to this common programming task, helping you efficiently manage and process your data in JavaScript projects.

Related posts:

×