Altcademy - a Forbes magazine logo Best Coding Bootcamp 2023

How to add all numbers in an array JavaScript

Getting Started with Arrays

JavaScript, a popular programming language used for web development, allows us to store multiple values within a single variable. This variable is known as an array. Imagine an array as a tray with multiple slots. Each slot can hold a different number, and you can retrieve these numbers at any time.

let numbers = [1, 2, 3, 4, 5];

In the code above, numbers is an array holding the values 1, 2, 3, 4, and 5.

The Task at Hand

Our task is to add all the numbers in a JavaScript array. This is like asking you to add all the numbers from the tray we mentioned earlier. If you were doing this manually, you would individually take each number from the tray and add them together. In programming, we do something quite similar using a concept known as a loop.

Understanding Loops

Loops, as the name suggests, allow us to repeat an action multiple times. For example, if we want to print "Hello, world!" 5 times, we can use a loop to repeat the print action. Here's how we can do it:

for (let i = 0; i < 5; i++) {
  console.log("Hello, world!");
}

The for loop above will print "Hello, world!" 5 times. The variable i acts as a counter that keeps track of how many times we've printed the message.

Adding Numbers in an Array

To add all the numbers in an array, we can use a for loop to visit each slot in our tray (array) and add the number in that slot to a sum. Here's how we can do it:

let numbers = [1, 2, 3, 4, 5];
let sum = 0;

for (let i = 0; i < numbers.length; i++) {
  sum = sum + numbers[i];
}

console.log(sum); // Outputs: 15

In the code above, we initialize sum to 0. Then, for each number in our numbers array, we add it to sum. The numbers.length gives us the number of slots in our tray or, in other words, the number of elements in our array.

The Magic of JavaScript Array Methods

JavaScript provides us with a more elegant way to add all the numbers in an array using a method called reduce(). A method in JavaScript is like an in-built action that we can perform on variables. The reduce() method reduces the array to a single value by performing a function on each element of the array from left to right.

let numbers = [1, 2, 3, 4, 5];

let sum = numbers.reduce(function(total, num) {
  return total + num;
});

console.log(sum); // Outputs: 15

In the code above, the reduce() method takes in a function as an argument. This function is applied to each element of the array. The total is the accumulated value returned in the last invocation of the function, and num is the current element. The function adds the current element to the total and returns this sum which then becomes the total for the next invocation.

Conclusion

Adding all numbers in an array might seem like a mundane task but it's akin to learning how to add two numbers together when we first started learning mathematics. It forms the foundation for more complex operations and algorithms. We've walked through two different methods to achieve this - the good old for loop and the more elegant reduce() method. Both methods have their place and their use will depend on the specific problem at hand.

In programming, there isn't always one "right" way to do something - there are often multiple paths to arrive at the same destination. The journey of learning to program is exciting and filled with endless possibilities, much like a treasure hunt. Each problem we solve and each concept we learn is a valuable gem in our treasure chest. Happy coding!