Sum similar numeric values within array of objects - JavaScript

Suppose, we have an array of objects like this ?

const arr = [
   {"firstName":"John", "value": 89},
   {"firstName":"Peter", "value": 151},
   {"firstName":"Anna", "value": 200},
   {"firstName":"Peter", "value": 22},
   {"firstName":"Anna","value": 60}
];

We are required to write a JavaScript function that takes in one such array and combines the value property of all those objects that have similar value for the firstName property.

Therefore, for the above array, the output should look like ?

const output = [
   {"firstName":"John", "value": 89},
   {"firstName":"Peter", "value": 173},
   {"firstName":"Anna", "value": 260}
];

Approach

For each object, we iterate through the array and find objects with similar firstName values. We combine their values into a single object and avoid duplicates by tracking what we've already processed.

Using Array Iteration

const arr = [
   {"firstName":"John", "value": 89},
   {"firstName":"Peter", "value": 151},
   {"firstName":"Anna", "value": 200},
   {"firstName":"Peter", "value": 22},
   {"firstName":"Anna","value": 60}
];

const sumSimilar = arr => {
   const res = [];
   for(let i = 0; i < arr.length; i++){
      const ind = res.findIndex(el => el.firstName === arr[i].firstName);
      if(ind === -1){
         res.push(arr[i]);
      }else{
         res[ind].value += arr[i].value;
      };
   };
   return res;
};

console.log(sumSimilar(arr));

[
   { firstName: 'John', value: 89 },
   { firstName: 'Peter', value: 173 },
   { firstName: 'Anna', value: 260 }
]

Using reduce() Method

A more functional approach using the reduce() method:

const arr = [
   {"firstName":"John", "value": 89},
   {"firstName":"Peter", "value": 151},
   {"firstName":"Anna", "value": 200},
   {"firstName":"Peter", "value": 22},
   {"firstName":"Anna","value": 60}
];

const sumSimilarReduce = arr => {
   return arr.reduce((acc, curr) => {
      const existing = acc.find(item => item.firstName === curr.firstName);
      if (existing) {
         existing.value += curr.value;
      } else {
         acc.push({...curr});
      }
      return acc;
   }, []);
};

console.log(sumSimilarReduce(arr));

[
   { firstName: 'John', value: 89 },
   { firstName: 'Peter', value: 173 },
   { firstName: 'Anna', value: 260 }
]

Using Map for Better Performance

For larger datasets, using a Map provides better lookup performance:

const arr = [
   {"firstName":"John", "value": 89},
   {"firstName":"Peter", "value": 151},
   {"firstName":"Anna", "value": 200},
   {"firstName":"Peter", "value": 22},
   {"firstName":"Anna","value": 60}
];

const sumSimilarMap = arr => {
   const map = new Map();
   
   arr.forEach(item => {
      if (map.has(item.firstName)) {
         map.get(item.firstName).value += item.value;
      } else {
         map.set(item.firstName, {...item});
      }
   });
   
   return Array.from(map.values());
};

console.log(sumSimilarMap(arr));

[
   { firstName: 'John', value: 89 },
   { firstName: 'Peter', value: 173 },
   { firstName: 'Anna', value: 260 }
]

Performance Comparison

Conclusion

All three methods effectively sum similar objects based on firstName. Use the Map approach for better performance with large datasets, or the reduce method for cleaner functional code.