JavaScript Break and Continue

❮ Previous Next ❯

The break statement helps you leave a loop.

The continue statement skips one cycle in the loop.

The Break Statement

In a previous part of this tutorial, you encountered the break statement. It was employed to exit from a switch() statement, allowing the program to move on.

The break statement lets you exit a loop.

In the example given, the loop stops or breaks when the loop counter (i) equals 3, thanks to the break statement.

The Continue Statement

Within a loop, the continue statement pauses the current iteration if a certain condition is met, allowing the loop to proceed with the next iteration.

This example skips the value of 3:

JavaScript Labels

To mark JavaScript statements, you put a label name followed by a colon before the statements.

label:
statements

In JavaScript, the break and continue statements are the only ones that can jump out of a code block.

Syntax:

break labelname;

continue labelname;

The continue statement, whether with or without a label reference, is used to skip a single iteration in a loop.

The break statement, when not accompanied by a label, is specifically designed to exit from a loop or a switch statement.

Using a label reference, the break statement allows you to exit any code block.

A code block is a chunk of code enclosed between curly braces { and }.

<!DOCTYPE html>
<html>
  <body>
    <h2>JavaScript Loops</h2>
    <p>A loop with a <b>break</b> statement. </p>
    <p id="demo"></p>
    <script>
      let text = "";
      for (let i = 0; i < 10; i++) {
        if (i === 3) {
          break;
        }
        text += "The number is " + i + " <br> ";
      }
      document.getElementById("demo").innerHTML = text;
    </script>
  </body>
</html>

<!DOCTYPE html>
<html>
  <body>
    <h2>JavaScript Loops</h2>
    <p>A loop with a <b>continue</b> statement. </p>
    <p>A loop which will skip the step where i = 3.</p>
    <p id="demo"></p>
    <script>
      let text = "";
      for (let i = 0; i < 10; i++) {
        if (i === 3) {
          continue;
        }
        text += "The number is " + i + " <br> ";
      }
      document.getElementById("demo").innerHTML = text;
    </script>
  </body>
</html>

<!DOCTYPE html>
<html>
  <body>
    <h2>JavaScript break</h2>
    <p id="demo"></p>
    <script>
      const cars = ["BMW", "Volvo", "Saab", "Ford"];
      let text = "";
      list: {
        text += cars[0] + " <br> "; 
        text += cars[1] + " <br> "; 
        break list;
        text += cars[2] + " <br> "; 
        text += cars[3] + " <br> "; 
      }
      document.getElementById("demo").innerHTML = text;
    </script>
  </body>
</html>

❮ Previous Next ❯

JavaScript Tutorial

JS Math

JS Versions

JS Objects

JS Functions

JS Classes

JS Async

JS HTML DOM

JS Browser BOM

JS Web APIs

JS AJAX

JS JSON

JS vs jQuery

JS Graphics

JavaScript Break and Continue

The Break Statement

The Continue Statement

JavaScript Labels

Web Development