Calculating the total of an array's values using JavaScript

Question

Calculating the total of an array's values using JavaScript

Receiving information from an API and looking to aggregate the values it contains. Consider the following code snippet:

function totalPesos(){
    $http.get('/api/valueForTest')
    .then(function(data){
        $scope.resumePesos = data.data.Response;
        //console.log($scope.resumePesos);
}

The response retrieved is:

[{Id: 60, Name: Chuck, Quantity: 300},
{Id: 61, Name: Arthur, Quantity: 199},
{Id: 62, Name: John, Quantity: 450}]

The goal is to sum the Quantity. How can this be achieved? An attempt with the following code was made:

$scope.resumePesos.reduce(function(a,b){return a + b; });

However, the result obtained was [object Object]

javascript angularjs

Answer 1

Answer №1

Experiment with the following JavaScript code snippet:

let items = [{Id: 60, Name: 'Chuck', Quantity: 300},
{Id: 61, Name: 'Arthur', Quantity: 199},
{Id: 62, Name: 'John', Quantity: 450}]
let totalQuantity = items.reduce(function(sum, currentItem){
  sum += currentItem['Quantity'];
  return sum;
},0)
console.log(totalQuantity);

Answer 2

Experiment with the following JavaScript code snippet:

let items = [{Id: 60, Name: 'Chuck', Quantity: 300},
{Id: 61, Name: 'Arthur', Quantity: 199},
{Id: 62, Name: 'John', Quantity: 450}]
let totalQuantity = items.reduce(function(sum, currentItem){
  sum += currentItem['Quantity'];
  return sum;
},0)
console.log(totalQuantity);

Answer 3

Answer №2

If I were to rephrase it, it would go something like this:

const totalQuantity = $scope.resumePesos.reduce((accumulator, currentItem) => accumulator + currentItem.Quantity, 0);

Keep in mind that when using the reduce method, the first parameter in the function is the accumulator and the second parameter is each value being iterated over, which in this scenario is each object. Therefore, you must access the Quantity property of each object. Additionally, make sure to provide 0 as the initial value for the accumulator in the reduce method since we want a numerical result.

Answer 4

If I were to rephrase it, it would go something like this:

const totalQuantity = $scope.resumePesos.reduce((accumulator, currentItem) => accumulator + currentItem.Quantity, 0);

Keep in mind that when using the reduce method, the first parameter in the function is the accumulator and the second parameter is each value being iterated over, which in this scenario is each object. Therefore, you must access the Quantity property of each object. Additionally, make sure to provide 0 as the initial value for the accumulator in the reduce method since we want a numerical result.

Answer 5

Answer №3

Here is an alternative approach you can consider:

$scope.resumePesos.reduce((x,y) => {return x + y.Quantity}, 0); // Remember to include 0 at the end

Answer 6

Here is an alternative approach you can consider:

$scope.resumePesos.reduce((x,y) => {return x + y.Quantity}, 0); // Remember to include 0 at the end

Answer 7

Answer №4

There are two errors you need to address here - first, make sure to initialize a starting value for the reduce function and secondly, ensure that you are summing up the numerical property of the object (.Quantity) rather than the object itself.

 var total = $scope.totalAmount.reduce(function(sum, item) {
    return sum + item.Quantity; 
 }, 0);

Answer 8

There are two errors you need to address here - first, make sure to initialize a starting value for the reduce function and secondly, ensure that you are summing up the numerical property of the object (.Quantity) rather than the object itself.

 var total = $scope.totalAmount.reduce(function(sum, item) {
    return sum + item.Quantity; 
 }, 0);

Answer 9

Answer №5

The Solution

$scope.total = $scope.resumePesos.reduce(function(a,b){return a + b.Quantity; }, 0);

Answer 10

The Solution

$scope.total = $scope.resumePesos.reduce(function(a,b){return a + b.Quantity; }, 0);

Answer 11

Answer №6

If you're looking to incorporate additional functions into your project, consider utilizing lodash for added functionality.

For example:

_.sumBy($scope.resumePesos, 'Quantity');

var data = [
  {Id: 60, Name: 'Chuck', Quantity: 300},
  {Id: 61, Name: 'Arthur', Quantity: 199},
  {Id: 62, Name: 'John', Quantity: 450}
]
  
console.log(_.sumBy(data, 'Quantity'));

<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.4/lodash.min.js"></script>

Answer 12

If you're looking to incorporate additional functions into your project, consider utilizing lodash for added functionality.

For example:

_.sumBy($scope.resumePesos, 'Quantity');

var data = [
  {Id: 60, Name: 'Chuck', Quantity: 300},
  {Id: 61, Name: 'Arthur', Quantity: 199},
  {Id: 62, Name: 'John', Quantity: 450}
]
  
console.log(_.sumBy(data, 'Quantity'));

<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.4/lodash.min.js"></script>

Answer 13

Answer №7

Thank you to everyone who provided suggestions, I followed your advice and it worked perfectly!

Answer 14

Thank you to everyone who provided suggestions, I followed your advice and it worked perfectly!

Calculating the total of an array's values using JavaScript

Answer №1

Answer №2

Answer №3

Answer №4

Answer №5

Answer №6

Answer №7

Similar questions

Enhancing React components with Hooks and markers

Creating obstacles in a canvas can add an extra layer of challenges and

Issue with Stack Divider not appearing on Chakra UI card

What is the best way to include a non-Typed Angular service in a TypeScript class?

Issues with displaying public images in Next.js production build are being reported

New from Firefox 89: The afterprint event!

Encountered a 404 error when attempting to deploy create-react-app due to failed resource loading

Communicating with my own account through Nodemailer

I would like to inquire about the process of accessing profile information on a website through the LinkedIn API

What is the best method to retrieve child elements from a class list object?

Encountering an "Unspecified Reference Error" while attempting to retrieve data from an API in your

Error encountered: Unexpected syntax error found in jQuery ajax call

Passing a property to a click event handler in ES6 with React: What's the best approach?

Best method to generate an element using any jQuery selector string

Combining two objects in node-red: A step-by-step guide

Interactive Vue components with dynamic children and sub-children

Exploring the connection between Django and AngularJS: delving into the router functionality and how Django variables are assigned

Tips on saving Firebase Storage image url in Firebase database?

Removing connected entries with pre middleware on mongoose

What is the process for updating the combination selector for each product within a specific category in PrestaShop 1.7?