Loops

Loops are a really powerful feature of JavaScript. They allow us to repeat actions a set number of times or for each element in a collection (like an array).

Let's say you want to print out every single element of an array to your console. You could use their indexes to do this:

var cities = ['Toronto', 'Vancouver', 'Halifax', 'Ottawa', 'London']
console.log(cities[0])
console.log(cities[1])
console.log(cities[2])
console.log(cities[3])
console.log(cities[4])

However, as soon as we add or remove elements from the array, we need to change the code that logs each city to the console.

A better option is to use a loop. A loop lets us repeat an action or run a piece of code as many times as we need.

For loops

To loop over an array, we can use a for loop.

This would allow us to loop over our cities array and output each city.

var cities = ['Toronto', 'Vancouver', 'Halifax', 'Ottawa', 'London']
for (var i = 0; i < cities.length; i++) {
   console.log(cities[i])
}

// Would log to the console:
// Toronto
// Vancouver
// Halifax
// Ottawa
// London

While loops

We could also use while loops. A while loop continues until its condition is no longer true. To write a while loop in JavaScript, we start with the while keyword, followed by a condition. Then, inside curly brackets, we write the code that we want to repeat.

while (condition) {
  // code to repeat goes here
}
In this example, we're looping until our counter reacher 10:

var counter = 0
while (counter < 10) {
  console.log(counter)
  // increment the counter
  counter += 1
}

To increment a counter in JavaScript, we can write this code:

counter = counter + 1

Or we could shorten it to:

counter += 1