Altcademy - a Forbes magazine logo Best Coding Bootcamp 2023

How to Break Out of Loops in JavaScript

Learning to code can be an exciting journey. As you progress, you'll inevitably encounter loops, which are essential constructs in programming. Loops are great because they allow you to repeat a set of instructions multiple times until a certain condition is met. However, there might be situations where you'd want to exit a loop before it has completed all its iterations. In this article, we'll explore different ways to break out of loops in JavaScript.

JavaScript provides two keywords to help you exit a loop: break and continue. We'll be discussing these in detail, but before we do that, let's start with a brief introduction to loops in JavaScript.

Loops in JavaScript

Loops in JavaScript can be categorized into three main types: for, while, and do...while.

The for loop

The for loop is used when you know how many times you want to repeat the loop. It consists of three parts: the initialization, the condition, and the final expression (which updates the loop counter). Here's the syntax:

for (initialization; condition; finalExpression) {
  // code to be executed
}

The while loop

The while loop is used when you don't know how many times you want to repeat the loop, but you do know the condition under which it should continue. The syntax is:

while (condition) {
  // code to be executed
}

The do...while loop

The do...while loop is similar to the while loop, but it guarantees that the loop body will execute at least once even if the condition is false from the start. The syntax is:

do {
  // code to be executed
} while (condition);

Now that we've covered the basics of loops let's see how we can break out of them using break and continue.

The break statement

The break statement is used to "break" out of a loop. When the break statement is encountered, the loop is immediately terminated, and the program continues with the next statement after the loop.

Here's an example using a for loop:

for (let i = 0; i < 10; i++) {
  if (i === 5) {
    break;
  }
  console.log(i);
}

In this example, the loop will print the numbers 0 to 4. When the value of i reaches 5, the break statement is executed, and the loop is terminated.

Similarly, you can use the break statement with while and do...while loops.

let i = 0;
while (i < 10) {
  if (i === 5) {
    break;
  }
  console.log(i);
  i++;
}

In this example, the loop will also print the numbers 0 to 4, and then the break statement will terminate the loop when i is equal to 5.

The continue statement

The continue statement is used to skip the current iteration of a loop and move on to the next one. When the continue statement is encountered, the loop skips the remaining code in the current iteration and starts the next iteration.

Here's an example using a for loop:

for (let i = 0; i < 10; i++) {
  if (i === 5) {
    continue;
  }
  console.log(i);
}

In this example, the loop will print the numbers 0 to 4, skip the number 5, and then print the numbers 6 to 9. The continue statement is used to skip the iteration when i is equal to 5.

Just like break, you can use the continue statement with while and do...while loops.

let i = 0;
while (i < 10) {
  if (i === 5) {
    i++;
    continue;
  }
  console.log(i);
  i++;
}

In this example, the loop will also print the numbers 0 to 4, skip the number 5, and then print the numbers 6 to 9.

Nested loops and labeled statements

Sometimes, you might encounter nested loops, which are loops within loops. In these cases, you might want to break out of the inner loop, outer loop, or both. JavaScript provides labeled statements to help you control the flow of the program in these situations.

A labeled statement is a statement that you can refer to using a label. You can use a label with a break or continue statement to specify which loop you want to break out of or continue.

Here's an example of using labeled statements with nested loops:

outerLoop: for (let i = 0; i < 3; i++) {
  for (let j = 0; j < 3; j++) {
    if (i === 1 && j === 1) {
      break outerLoop;
    }
    console.log(`i: ${i}, j: ${j}`);
  }
}

In this example, we have two nested for loops. We want to break out of the outer loop when i is equal to 1 and j is equal to 1. To achieve this, we use a labeled statement outerLoop: before the outer loop and then use break outerLoop; within the inner loop.

Conclusion

Loops are a powerful tool in programming, allowing you to repeat a set of instructions multiple times. However, there might be cases where you want to exit a loop before it has completed all its iterations. In this article, we discussed different ways to break out of loops in JavaScript using the break and continue statements, as well as labeled statements for nested loops.

As you continue to learn programming, you'll find these techniques helpful in controlling the flow of your programs and writing efficient code. Happy coding!