Continue Statement in JavaScript.

In this article, you will learn everything that you need to know about the Continue Statement in JavaScript along with some examples.

What is Continue Statement in JavaScript?

The Continue Statement in JavaScript is used to end processing the current iteration of the loop and go right to its next iteration. 

With the use of the Continue Statement, instead of terminating out of the overall loop, it is possible to break only from the current iteration in the loop. 

Continue Statement Syntax

Without using label reference:

continue;

Using label reference:

continue labelname; (the label is optional and used rarely)

How does Continue Statement work in JavaScript?

The Continue Statement skips one iteration. If one of the loop’s conditions is met, it immediately breaks the condition and moves on to the next iteration. 

Only one loop iteration will be skipped either the continue statement is used without or with a reference label. 

When we use the if condition, for loop, while loop, and do…while loop to specify certain conditions. The continue statement skips over the loop’s condition and moves on to the next iteration of the loop.


Figure 1: Working Mechanism of JavaScript Continue Statement

Flow chart of Continue Statement

Figure 2: Flowchart of Continue Statement

Continue Statement in For loop

In the context of for loop, continue terminates the current iteration of the loop and the control flow of the program skips to the next iteration.

Example No. 1 

In the below example, the for loop iteration starts with 0 and terminates at 5. 

When the loop iteration reaches a value of 2, a conditional statement checks, and the iteration is skipped to the next one because of the use of the continue statement.

Code

<!DOCTYPE html>

<html lang="en">

<head>

    <title>Continue Statement in For Loop</title>

</head>

<body style="background-color: black; color: white;">

    <h1>Continue Statement in For Loop</h1>

    <p id="continue"></p>

    <script>

        let output = "";

        // Start for loop

        for (let i = 0; i < 5; i++) {

            if (i === 2) {

                continue;   //use of continue statement

            }

            output += "The result number is: " + i + "<br>";

        }

        // end for loop

        document.getElementById("continue").innerHTML = output;

    </script>

    <p>From above, you can see that the step where i = 2 is skipped.</p>

</body>

</html>

Screenshot

The above example states that; 

  • When the value of i is equal to 2, the continue statement terminates the second iteration.
  • The second iteration is skipped and is not printed out.
  • Now, the value of i becomes 3, and the condition and continue statement are executed again.
  • Therefore, 4 is printed out in the next iteration.

Output

Continue Statement in While loop

In the context of the while loop when the continue statement is used, it terminates the current iteration of the loop, and the control flow of the program moves back to the while condition.

Example No. 2

In the below example, the continue statement is used in the while loop. 

The iteration starts with 0 and terminates at 5. 

During the loop run, there is a conditional statement using the operator OR (||), which checks when the loop iteration reaches a value of 2 and 3, and the iteration is skipped to the next one because of the use of the continue statement.

Code

<!DOCTYPE html>

<html lang="en">

<head>

    <title>Continue Statement in While Loop</title>

</head>

<body style="background-color: black; color: white;">

    <h1>Continue Statement in While Loop</h1>

    <p id="continue"></p>

    <script>

        let output = "";

        let i = 0;

        // Start while loop

        while (i < 5) {

            i++;

            if (i === 2 || i === 3)

                continue;   //use of continue statement

            output += "The number is: " + i + "<br>";

        }

        // End while loop

        document.getElementById("continue").innerHTML = output;

    </script>

    <p>From above, you can see that the value 2 and 3 are skipped.</p>

</body>

</html>

Screenshot

The above example states that; 

  • When the value of i is equal to 2 or 3, the continue statement terminates the second or third iteration respectively.
  • The second and third iteration is skipped and is not printed out.
  • Now, the value of i becomes 4, and the condition and continue statement are executed again.
  • Therefore, 4 and 5 are printed out in the next two iterations.

Output

Note: The continue statement executes in the same way for the while and do…while loops.

Continue Statement inside Nested Loop

In the context of nested loops, the continue statement terminates the current iteration of the inner loop.

Example No.3

In the below example, continue is used with the nested loop; it terminates the current iteration of the inner for loop. 

According to the example, when the continue statement executes then it terminates the current iteration of the inner for loop and the control flow of the program moves to the next iteration of the inner for loop. 

Thus, the value of j = 1 is skipped in the output.

Code

<!DOCTYPE html>

<html lang="en">

<head>

    <title>Continue Statement inside Nested Loop</title>

</head>

<body style="background-color: black; color: white;">

    <h2>Continue Statement inside Nested Loop</h2>

    <p id="continue"></p>

    <script>

        let output = "";

        // first for loop

        for (let i = 1; i <= 2; i++) {

            // second for loop

            for (let j = 1; j <= 2; j++) {

                if (j === 1) {

                    continue;   //use of continue statement

                }

                output += "Value of: " + `i = ${i}, j = ${j}` + "<br>";

                document.getElementById("continue").innerHTML = output;

            }

        }

    </script>

    <p>From above, you can see that the value of j = 1 is skipped.</p>

</body>

</html>

Screenshot

The above example states that; 

  • When the value of j in the inner for loop is equal to 1, the continue statement executes and it skips the current iteration in the inner for loop.
  • The first iteration is skipped and is not printed out.
  • Now, the control flow of the program moves to the next iteration and the continue statement is executed again.
  • The second iteration is printed out in the next iteration.
  • Hence, the value of j equal to 1 is skipped and never printed out.

Output

Labeled Continue Statement in JavaScript

When the label is used with the continue statement then it allows you to terminate a loop iteration. 

In the context of a nested loop statement, the label helps to jump out from an inner loop to an outer loop. 

Generally, a continue statement with the label in it is used hardly as this leads to the program's complexity to read and understand.

Example No.4 

In the below example, the label is being used with continue. 

Nested for loop is used where the inner loop is labeled as innerlabel and outer loop is labeled as outerlabel

Code

<!DOCTYPE html>

<html>

<body style="background-color: black; color: white;">

    <h2> Continue statement with label </h2>

    <p id="continue"></p>

    <script>

        let output = "";

        outerlabel:     // This for loop is labeled as "outerlabel"  

        for (let i = 1; i <= 2; i++) {

            innerlabel:    // This for loop is labeled as "innerlabel"  

            for (let j = 1; j <= 2; j++) {

                if (j === 1) {

                    continue innerlabel;    //use of continue statement with label

                }

                output += "<br>" + "i = " + i + ", j = ";

                document.getElementById("continue").innerHTML = output += j + " ";

            }

        }  

    </script>

    <p>From above, you can see that the value of j = 1 is skipped.</p>

</body>

</html>

Screenshot

Output

What is the use of Continue Statement in JavaScript?

The use of the Continue Statement is to skip the current iteration and move to the next iteration in a loop.

Continue statement can be beneficial when we know that there is not any point in continuing the execution within the current loop and we desire to preserve processor cycles or prevent an error from occurring by moving right along to the next iteration of the loop.

It is used only inside loops like for loop, while loop, and do-while loop.

If we use the continue statement in the program, then the flow of the program immediately ends the current scenario and starts a new one. When we apply the continue statement in our program, then the control remains in the same loop.

The Continue Statement with the absence or presence of label reference can only be used to jump out of one loop iteration.

Post a Comment

0 Comments