JavaScript break and continue

In this tutorial, you'll learn how to control the flow of loops in JavaScript using the break and continue statements. These statements are essential for managing loop execution, allowing you to either exit a loop entirely or skip certain iterations based on specific conditions.

Introduction

Loops are fundamental constructs in programming that allow you to execute a block of code repeatedly. However, sometimes you need more control over the loop's behavior—such as stopping it prematurely or skipping some iterations. The break and continue statements provide this control by altering the normal flow of loops.

• break: Exits the loop entirely when executed.
• continue: Skips the current iteration and moves to the next one.

Understanding these statements is crucial for writing efficient and effective JavaScript code, especially in scenarios where you need precise control over repetitive tasks.

Using the break Statement

The break statement is used to exit a loop prematurely. When a break statement is encountered inside a loop, the loop terminates immediately, and the program continues with the next statement following the loop.

Example 1: Exiting a Loop on Condition

In this example, we'll use a for loop to iterate through numbers from 1 to 10. The loop will exit as soon as it encounters the number 5.

1for (let i = 1; i <= 10; i++) {
2  if (i === 5) {
3      break;
4  }
5  console.log(i);
6}

1
2
3
4

In this example, the loop prints numbers from 1 to 4. When i becomes 5, the break statement is executed, and the loop terminates immediately.

Example 2: Using break in a Nested Loop

The break statement can also be used inside nested loops. When used in this context, it only exits the innermost loop by default.

1for (let i = 1; i <= 3; i++) {
2  for (let j = 1; j <= 3; j++) {
3      if (i === 2 && j === 2) {
4          break;
5      }
6      console.log(`i: ${i}, j: ${j}`);
7  }
8}

i: 1, j: 1
i: 1, j: 2
i: 1, j: 3
i: 2, j: 1
i: 3, j: 1
i: 3, j: 2
i: 3, j: 3

In this example, the inner loop exits when i is 2 and j is 2. The outer loop continues its execution.

Using the continue Statement

The continue statement is used to skip the current iteration of a loop and move on to the next one. When a continue statement is encountered, the rest of the code inside the loop for that particular iteration is skipped, and the loop proceeds with the next iteration.

Example 3: Skipping Even Numbers

In this example, we'll use a for loop to iterate through numbers from 1 to 10. The loop will skip printing even numbers.

1for (let i = 1; i <= 10; i++) {
2  if (i % 2 === 0) {
3      continue;
4  }
5  console.log(i);
6}

1
3
5
7
9

In this example, the loop prints only odd numbers. When i is even, the continue statement skips the current iteration, and the next number is processed.

Example 4: Using continue in a Nested Loop

The continue statement can also be used inside nested loops. Like break, it affects only the innermost loop by default.

1for (let i = 1; i <= 3; i++) {
2  for (let j = 1; j <= 3; j++) {
3      if (i === 2 && j === 2) {
4          continue;
5      }
6      console.log(`i: ${i}, j: ${j}`);
7  }
8}

i: 1, j: 1
i: 1, j: 2
i: 1, j: 3
i: 2, j: 1
i: 2, j: 3
i: 3, j: 1
i: 3, j: 2
i: 3, j: 3

In this example, the inner loop skips processing when i is 2 and j is 2. The outer loop continues its execution.

Practical Example

Let's create a practical example that demonstrates both break and continue statements in action. We'll write a program that finds all prime numbers up to a given limit, skipping non-prime numbers and stopping when it reaches a specified count of primes.

1function isPrime(num) {
2  if (num <= 1) return false;
3  for (let i = 2; i <= Math.sqrt(num); i++) {
4      if (num % i === 0) {
5          return false;
6      }
7  }
8  return true;
9}
10 
11const limit = 50;
12const count = 10;
13let foundPrimes = [];
14 
15for (let num = 2; num <= limit; num++) {
16  if (!isPrime(num)) {
17      continue;
18  }
19  foundPrimes.push(num);
20  if (foundPrimes.length === count) {
21      break;
22  }
23}
24 
25console.log(`Found ${count} prime numbers up to ${limit}:`, foundPrimes.join(', '));

Found 10 prime numbers up to 50: 2, 3, 5, 7, 11, 13, 17, 19, 23, 29

In this example:

• The isPrime function checks if a number is prime.
• We iterate through numbers from 2 to 50.
• If a number is not prime, we skip it using continue.
• If a prime number is found, we add it to the foundPrimes array.
• When the array reaches the specified count (10), we exit the loop using break.

Summary

In this tutorial, you learned how to control loop execution in JavaScript using the break and continue statements:

• Use break when you need to exit a loop based on a specific condition.
• Use continue when you want to skip certain iterations without terminating the loop.

Understanding these statements is essential for writing efficient and effective JavaScript code, especially in scenarios where precise control over repetitive tasks is required.

What's Next?

In the next tutorial, we'll explore JavaScript functions. Functions are reusable blocks of code that perform specific tasks and are a fundamental building block of any programming language. Learn about JavaScript Functions.

If you have any questions or need further clarification on break and continue, feel free to ask in the comments below!