Total of the various components within an array

Question

Total of the various components within an array

I'm new to programming and I'm trying to calculate the sum of all elements in an array. I've written this code, but it doesn't seem to be working properly. Can someone help me find my mistakes?

function ArrayAdder(_array) {
    this.sum = 0;
    this.array = _array || [];
}

ArrayAdder.prototype.computeTotal = function () {
    this.sum = 0;
    this.array.forEach(function (value) {
        this.sum += value;
    });
    return this.sum;
};

var numbersArray = new ArrayAdder([1, 2, 3]);
console.log(numbersArray.computeTotal());

javascript arrays sum

Answer 1

Answer №1

this in the context of a forEach callback actually refers to the global window object. To define the context of the callback, utilize the second argument of Array#forEach function.

this.array.forEach(function (value) {
    this.sum += value;
}, this); // <-- Now `this` is bound to the callback function.

function ArrayAdder(_array) {
    this.sum = 0;
    this.array = _array || [];
}

ArrayAdder.prototype.computeTotal = function () {
    this.sum = 0;
    this.array.forEach(function (value) {
        this.sum += value;
    }, this);
    return this.sum;
};

var myArray = new ArrayAdder([1, 2, 3]);

console.log(myArray.computeTotal());
document.write(myArray.computeTotal()); // For demonstration purposes

If you're seeking an alternative approach, consider using Array#reduce, demonstrated here with Arrow functions

var sum = arr.reduce((x, y) => x + y);

// Please note: This may not work in all browsers,
// verify compatibility in latest versions of Chrome/Firefox

var arr = [1, 2, 3];
var sum = arr.reduce((x, y) => x + y);

document.write(sum);

Answer 2

this in the context of a forEach callback actually refers to the global window object. To define the context of the callback, utilize the second argument of Array#forEach function.

this.array.forEach(function (value) {
    this.sum += value;
}, this); // <-- Now `this` is bound to the callback function.

function ArrayAdder(_array) {
    this.sum = 0;
    this.array = _array || [];
}

ArrayAdder.prototype.computeTotal = function () {
    this.sum = 0;
    this.array.forEach(function (value) {
        this.sum += value;
    }, this);
    return this.sum;
};

var myArray = new ArrayAdder([1, 2, 3]);

console.log(myArray.computeTotal());
document.write(myArray.computeTotal()); // For demonstration purposes

If you're seeking an alternative approach, consider using Array#reduce, demonstrated here with Arrow functions

var sum = arr.reduce((x, y) => x + y);

// Please note: This may not work in all browsers,
// verify compatibility in latest versions of Chrome/Firefox

var arr = [1, 2, 3];
var sum = arr.reduce((x, y) => x + y);

document.write(sum);

Answer 3

Answer №2

When dealing with the `forEach` function, the reference of `this` is altered. It is recommended to update your code as shown below:

function ArrayAdder(_array) {
  this.sum = 0;
  this.array = _array || [];
}

ArrayAdder.prototype.computeTotal = function() {
  this.sum = 0;
  var that = this;
  this.array.forEach(function(value) {
    that.sum += value;
  });
  return this.sum;
};

var myArray = new ArrayAdder([1, 2, 3]);
console.log(myArray.computeTotal());

The code above preserves the reference of `this` by using `that` for computation purposes.

Answer 4

When dealing with the `forEach` function, the reference of `this` is altered. It is recommended to update your code as shown below:

function ArrayAdder(_array) {
  this.sum = 0;
  this.array = _array || [];
}

ArrayAdder.prototype.computeTotal = function() {
  this.sum = 0;
  var that = this;
  this.array.forEach(function(value) {
    that.sum += value;
  });
  return this.sum;
};

var myArray = new ArrayAdder([1, 2, 3]);
console.log(myArray.computeTotal());

The code above preserves the reference of `this` by using `that` for computation purposes.

Answer 5

Answer №3

One way to efficiently accomplish this task is by utilizing the reduce method for arrays. Here's a simple example:

this.numbers = [5, 10, 15, 20];
this.total = this.numbers.reduce(function(num1, num2) {
  return num1 + num2;
});

Answer 6

One way to efficiently accomplish this task is by utilizing the reduce method for arrays. Here's a simple example:

this.numbers = [5, 10, 15, 20];
this.total = this.numbers.reduce(function(num1, num2) {
  return num1 + num2;
});

Answer 7

Answer №4

Give this a shot:

  const numbers = [10, 20, 30, 40, 50];
  const total = numbers.reduce((a, b)=> a+b);
  console.log(total);

Answer 8

Give this a shot:

  const numbers = [10, 20, 30, 40, 50];
  const total = numbers.reduce((a, b)=> a+b);
  console.log(total);

Total of the various components within an array

Answer №1

Answer №2

Answer №3

Answer №4

Similar questions

Building a static support button within Laravel

The issue with CSS filter invert not functioning properly in Mozilla Firefox is causing complications

Break down a data structure into a type that includes multiple options

Retrieving JSON information from the server

Differences Between Pointers for int and char Arrays in C

What is the best method for submitting an array of objects using Axios, Formik, and React.js?

Sequelize.js - Establishing Relationships Between Two Tables

The latest version of Next.js, 11.1.0, does not support monitoring for code changes within the node

Differentiating between clicks and dragging interactions within an HTML 5 canvas

What is the best way to display a PDF in a web browser using a JavaScript byte array?

Building a Vue application with customized authentication for the Google Calendar API in JavaScript

Arranging Arrays with Multiple Dimensions in PHP

Using Django to send AJAX POST requests to pass JavaScript variables for form initialization

Angular DataTable jQuery

Having trouble with sluggish performance on openbim-components? The OrthoPerspectiveCamera tends to slow down or get stuck when zooming

Guide to incorporating a defined quantity of elements into JavaScript arrays based on a certain condition

Error Encountered: The element specified is not recognized as a <Route> component. All children components within <Routes> should be either a <Route> or <React.Fragment>

Is memory allocated to the array's name?

Comparing $.fn.fancybox and $.fancybox: What sets them apart?

How can I retrieve the initial character from each string within an array using JavaScript?