JavaScript – Adding the totals in Array with same index

I have moved on to learning about looping over arrays and hit a hurdle – did try researching but I think I am probably not describing properly…

I have managed to total each line in the array. I did create another variable called total but not sure I needed that…

I get the output below, which all seem to occupy index 0 – think I have confused myself here 🙂

22
14
201

Now I want to add these values. -Any pointers would be most welcome.

function addArray(arr) {
  let total = [];

  let totalNumber = 0;
  for (let i = 0; i < arr.length; i++) {
    totalNumber += arr[i];
  }
  total.push(totalNumber);

  console.log(total[0])
  return totalNumber;
}

addArray([17, 2, 3])
addArray([2, 8, 2, 2])
addArray([150, 50, 1])

Answer

Rather than using three separate function calls, I suggest you use one, and pass through a 2d array (an array that contains other arrays):

addArrays([[17, 2, 3], [2, 8, 2, 2], [150, 50, 1]])

You can now create two separate functions. The first function is responsible for summing the numbers in a nested array (eg: [17, 2, 3] gives 22), and another for looping over each array you want to sum, and adding that to a total. You have already made the first function (although, as you mentioned, the total variable that stores an array isn’t needed, so this can be removed for this approach)

function sumArray(arr) {
  let totalNumber = 0;
  for (let i = 0; i < arr.length; i++) {
    totalNumber += arr[i];
  }
  return totalNumber;
}

The next step is to create a second function, that will loop through an array of arrays (so each element within your array is an array itself):

function sumArray(arr) {
  let totalNumber = 0;
  for (let i = 0; i < arr.length; i++) {
    totalNumber += arr[i];
  }
  return totalNumber;
}

function addArrays(arrays) {
  let totalNumber = 0;
  for (let i = 0; i < arrays.length; i++) {
    let currentArray = arrays[i];
    totalNumber += sumArray(currentArray); // sum the current array values, and add it to the total 
  }
  return totalNumber;
}

console.log(addArrays([[17, 2, 3], [2, 8, 2, 2], [150, 50, 1]])); // 237

The above can be written by using nested loops, but using functions to decompose your logic can help with clarity. You can use separate function calls though if you use a closure (ie: create a total sum in your function and return a function that is responsible for adding to that total). If you’re a beginner, I suggest the first approach as it’s more straightforward:

function createAdder() {
  let runningTotal = 0;
  return function(arr) {
    for (let i = 0; i < arr.length; i++) {
      runningTotal += arr[i];
    }
    return runningTotal;
  }
}
const addArray = createAdder();
addArray([17, 2, 3])
addArray([2, 8, 2, 2])
console.log(addArray([150, 50, 1]));

Finally, you can use array methods, such as .reduce() to make your code more concise. Using .reduce() hides an internal loop behind a method call, which allow you to “reduce” the values in your array into another/transformed value (in this case, your sum):

function addArrays(arrays) {
  return arrays.reduce(
    (totalSum, arr) => totalSum + arr.reduce((arrSum, num) => arrSum + num, 0)
  , 0);
}

console.log(addArrays([[17, 2, 3], [2, 8, 2, 2], [150, 50, 1]])); // 237