How to Call reduce on an Array of Objects to Sum Their Properties?

While working with arrays of objects in JavaScript, it is frequently needed to perform calculations on their properties. For instance, finding the sum of a specific property across all objects in an array is a common task. The “reduce()” method is a useful tool for completing such calculations because it allows you to collect a value iteratively based on the members of an array.

This tutorial will describe the procedure to call the reduce() method on an array of objects for finding the sum of their properties.

How to Call reduce on an Array of Objects to Sum Their Properties?

To sum the properties of an array of objects, pass the callback function to the “reduce()” method. This callback method accepts two arguments, an “accumulator” and the “current value”. The “current value” represents the currently being processed element, and the “accumulator” specifies the cumulative total of the sum. For calculating the sum of the specified property of the objects, use the dot (.) notation or bracket ([ ]) notation within the callback function.

Syntax
The given syntax is utilized for the “reduce()” method:

array.reduce(callbackFunc, initialValue)

Example 1
Create an array of objects named “inventory”, that has four objects containing names of the products and their respective quantities:

var inventory = [
{ productName: 'Bread', quantity: 30 },
{ productName: 'Butter', quantity: 45 },
{ productName: 'Juice', quantity: 58 },
{ productName: 'Oats', quantity: 40 }
];

Call the reduce() method with the callback function for getting the sum of the object’s property called “quantity”:

var totalProductsQuantity = inventory.reduce(function(previousVal, currentVal) {
return previousVal + currentVal.quantity;
}, 0);

Finally, print the reduced value of the sum of the quantity on the console:

console.log('Total Products Quantity:', totalProductsQuantity);

It can be observed that the sum of the properties of the objects has been successfully calculated:

Example 2
You can also define a function for calculating the sum of the specified object’s property. First, we will define an object named “student” with attributes/properties called “subject” and the “marks”:

var student = [
{ subject: 'Math', marks: 89 },
{ subject: 'Geography', marks: 72 },
{ subject: 'Science', marks: 65 },
{ subject: 'English', marks: 75 }
];

Define a function named “calculation()”, and for accessing the property of an object, utilize the bracket ([ ]) notation:

function calculation(obj, property) {
var calculate = obj.reduce(function(previousVal, currentVal) {
return previousVal + currentVal[property];
}, 0);
console.log('Total:', calculate);
}

Now, call the function by passing an object “student” and a property “marks” to determine the sum of the total marks obtained in all subjects:

calculation(student, 'marks');

Output

That’s all about how to call the reduce() method on an array of objects for calculating the sum of their properties.

Conclusion

Pass the callback function to the “reduce()” method for calculating the sum of the properties of an array of objects. For accessing the object’s properties, utilize the dot “.” notation or bracket “[ ]” notation within the callback function. This tutorial described the procedure for calling the reduce() method on an array of objects for finding the sum of their properties.

How to Call reduce on an Array of Objects to Sum Their Properties?

How to Call reduce on an Array of Objects to Sum Their Properties?

Conclusion

About the author

Farah Batool