Javascript Break

This statement is used to control the execution of code in a loop. In JavaScript, we can label a statement for later use.  The following illustrates the syntax of the label statement:-

Syntax:-
label: statement;  

The label can be any valid identifier. We can reference the label by using the break or continue statement.  Typically, we can use the label with nested loop such as for, do-while, and while loop.

The break statement terminates the loop immediately and passes control over the next statement after the loop.

Input:-
 <script>  
	for (var i = 1; i < 10; i++) {
     if (i % 4 == 0) {
         break;
     }
  }
  document.write(i);  
</script>

Output:-

In this example, the for loop increments the variable i from 1 to 10. In the body of the loop, the if statement checks if i is evenly divisible by 4. If so, the break statement is executed and the loop is terminated.

The control is passed to the next statement outside the loop that outputs the variable i to the console window.


Using break statement to exit nested loop

We use the break statement to terminate a label statement and transfer control to the next statement following the terminated statement.

Input:-
 <script>  
	 let iterations = 0; 
   top: for (let i = 0; i < 10; i++) { 
       for (let j = 0; j < 10; j++) { 
            iterations++; 
            if (i === 4 && j === 4) { 
                break top; 
            } 
        } 
   } 
   document.write(iterations); 
</script>

Output:-

In the above example:-

  • First, the variable iterations is set to zero.
  • Second, both loops increase the variable i and j from 1 to 10.  In the inner loop, we increase the iteration variable and use an if statement to check both i and j equal 4. If so, the break statement terminates both loops and passes the control over the next statement following the loop.

Continue statement

There is full control to handle loop statements in JavaScript. Sometimes, a situation occurs when we require to skip some code of the loop and move to the next iteration. It can be achieved by using JavaScript’s continue statement.

The continue statement skips the current iteration of a loop and goes to the next one. Because of this, the continue statement must appear in the body of a loop or you will get an error.

Input:-
 <script>  
	 for (var i = 1; i < 10; i++) {
      if (i % 4 == 0) {
          continue;
     }
  }
  document.write(i);
</script>

Output:-

In the below example:-

  • First, the for loops increment the variable i and j from 1 to 5.
  • Second, inside the body of the innermost loop, we check if both i and j are equal to 4. If so, we output a message to the web console and jump back to the outer label. Otherwise, we output the values of i and j in each iteration.
Input:-
 <script>  
	  outer: 
       for (let i = 1; i <= 5; i++) {
          for (let j = 1; j <= 5; j++) {
              if ((i == 4) && (j == 4)) {
                  document.write('<br/>continue to outer');
                  continue outer;
              }
              document.write("[i:" + i + ",j:" + j + "]");
            }
        }
</script>

Output:-