How to get the Sum of Array of Objects in JavaScript
Table of Contents
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:
JAVASCRIPTconst 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:
- The accumulator
- 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:
JAVASCRIPTconst 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);
BASH60
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:
JAVASCRIPTconst 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:
JAVASCRIPTconst 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:
JAVASCRIPTconst 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);
BASH40
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!
- Getting Started with TypeScript
- Getting Started with Svelte
- Getting Started with Express
- How to deploy a .NET app using Docker
- How to deploy a PHP app using Docker
- How to deploy a Deno app using Docker
- How to deploy a MySQL Server using Docker
- How to deploy a Node app using Docker
- Learn how to use v-model with a custom Vue component
- Using Puppeteer and Jest for End-to-End Testing
- Build a Real-Time Chat App with Node, Express, and Socket.io
- Getting Started with Moment.js