Learning how to sum a property in an array of objects in Typescript will enrich your knowledge of working with an array. So how to do it? Let’s go into detail now.
Sum a property in an array of objects in Typescript
The logic I will use here to sum a property in an array of the object for all cases is that I will loop over all the element in the array. Then I call the property I want to sum and store the sum value into one variable. I will show you some loops you can use to do it.
Use basic for loop
The most basic loop is the for loop.
Syntax:
for (expression 1; expression 2; expression 3) {
// Logic code
}
Parameters:
- expression 1: Execute once when executing the for loop code.
- expression 2: The condition to continue the for loop
- expression 3: Execute every time one loop is finished.
Example:
type infor = { name: string; age: number };
const inforArray: infor[] = [
{ name: "Anna", age: 18 },
{ name: "HanTon", age: 39 },
{ name: "James", age: 28 },
{ name: "Luffy", age: 23 },
{ name: "Toma", age: 35 },
{ name: "Joma", age: 50 },
];
let ageSum: number = 0;
for (let i = 0; i < inforArray.length; i++) {
ageSum += inforArray[i].age;
}
console.log(ageSum);Output:
[LOG]: 193Here I have an array of objects. Each object has an age property that is a number type. Then create a variable called ageSum to store the sum of all age properties. In each loop, I sum ageSum with the age property value. Here I call each array element by index inside square braces( [] ) and point to age property. Each loop time, I will increase to one then the index element of the array also increase.
Use reduce method
Typescript also provides a beneficial method to make for a sum total element in the array called reduce. The reduce method will return results through the entire loop. So I will need to create a variable to store that value.
Syntax:
Array.reduce(callback(preValue, currValue, currIndex, array),initial value)
Parameters:
- callback: Each loop time, the callback will be called.
- preValue: Indicate the result of the previous loop.
- currValue: Indicate the value of current element.
- currIndex: Indicate the index of the current element.
- array: Indicate the array. Can use like ‘this’ keyword.
- initialValue: The start point value of preValue.
Example:
type infor = { name: string; age: number };
const inforArray: infor[] = [
{ name: "Anna", age: 18 },
{ name: "HanTon", age: 39 },
{ name: "James", age: 28 },
{ name: "Luffy", age: 23 },
{ name: "Toma", age: 35 },
{ name: "Joma", age: 50 },
];
const sumAge = inforArray.reduce((preValue, currValue) => {
preValue += currValue.age;
return preValue;
}, 0);
console.log(sumAge);Output:
[LOG]: 193In each time loop, I will go plus the preValue, which initialize 0 versus the age property. Then I return preValue, and that value will be stored for the next loop.
Summary
In this article, I showed you how to sum a property in an array of objects in TypeScript. You can use the typical for loop or reduce method, which is made for that purpose. There are also many methods for you, like the forEach and map methods. You can pick one that is suitable for you.
Maybe you are interested:
- How to get the sum of an Array of Numbers in Typescript
- How To Define An Array With Multiple Types In TypeScript
Hello, guys! I hope that my knowledge in HTML, CSS, JavaScript, TypeScript, NodeJS, ReactJS, MongoDB, Python, MySQL, and npm computer languages may be of use to you. I’m Brent Johnson, a software developer.
Name of the university: HOU
Major: IT
Programming Languages: HTML, CSS, JavaScript, TypeScript, NodeJS, ReactJS, MongoDB, PyThon, MySQL, npm