How to get the Sum of Array of Objects in JavaScript

Updated onbyAlan Morel
How to get the Sum of Array of Objects in JavaScript

Sometimes when you have an array of objects, you may want to sum the values of a specific property.

For example, you may have an array of objects that represent a list of products and you want to sum the price of all the products.

In this post, we will look at how to sum the values of a specific property in an array of objects in JavaScript.

How to Sum the Values of a Specific Property in an Array of Objects in JavaScript

To sum the values of a specific property in an array of objects in JavaScript, first, let"s define an array of objects:

JAVASCRIPT
const products = [ { name: "Product 1", price: 10 }, { name: "Product 2", price: 20 }, { name: "Product 3", price: 30 }, ];

This array has a name and price property for each product.

The easiest way to sum the values of a specific property in an array of objects is to use the reduce() function.

This function takes a callback function with two parameters:

  1. The accumulator
  2. The current value

We will use the accumulator to store the sum of the values of the property and the current value to store the current value of the property.

Let's use the price property as an example:

JAVASCRIPT
const products = [ { name: "Product 1", price: 10 }, { name: "Product 2", price: 20 }, { name: "Product 3", price: 30 }, ]; const sum = products.reduce((acc, product) => acc + product.price, 0); console.log(sum);
BASH
60

Sometimes you need to filter out some of the objects before you sum the values of a specific property.

For example, let's say you cannot sum the price of products that are out of stock.

Here's an example product array with a new inStock boolean:

JAVASCRIPT
const products = [ { name: "Product 1", price: 10, inStock: true }, { name: "Product 2", price: 20, inStock: false }, { name: "Product 3", price: 30, inStock: true }, ];

We can first filter the products for only those in stock:

JAVASCRIPT
const products = [ { name: "Product 1", price: 10, inStock: true }, { name: "Product 2", price: 20, inStock: false }, { name: "Product 3", price: 30, inStock: true }, ]; const inStockProducts = products.filter(product => product.inStock);

Then we can sum the price of the products that are in stock:

JAVASCRIPT
const products = [ { name: "Product 1", price: 10, inStock: true }, { name: "Product 2", price: 20, inStock: false }, { name: "Product 3", price: 30, inStock: true }, ]; const inStockProducts = products.filter(product => product.inStock); const sum = inStockProducts.reduce((acc, product) => acc + product.price, 0); console.log(sum);
BASH
40

Conclusion

In this post, we looked at how to sum the values of a specific property in an array of objects in JavaScript.

The easiest way to do this is to use the reduce() function, but you can also pair it with the filter() function to filter out some of the objects before you sum the values of a specific property.

Thanks for reading!

To learn more about web development, founding a start-up, and bootstrapping a SaaS, follow me on X!
Copyright © 2017 - 2024 Sabe.io. All rights reserved. Made with ❤ in NY.