This article will teach you, with the help of a few examples, what you need to know about the continue statement. But, first, let’s define the continue statement, and see what the syntax looks like.
When we declare a specific condition in a loop, the continue statement skips one loop iteration and the control flow of the program continues to the next iteration in the loop.
The syntax of the continue statement is simple and you can use unlabelled form continue; or optional labeled form of the syntax, although that one is rarely used continue [label];.
Continue statement in a for loop
Let’s take a look at a simple example and see how the continue statement behaves with the for loop where we declare that the value of 4 should be skipped. The i starts with 0 and increments by 1 all the way up to 6, but one iteration is skipped: “Our number is 4” is not listed among results in the output. Let’s see below how this works.
for (let i = 0; i < 7; i++) {
if (i === 4) { continue; }
text += "Our number is " + i + "
";
}As you can see, in a for loop, javascript first evaluates the increment expression (in our case i++). After that, javascript tests the condition to find out if another iteration should be done. So, the output of the code above is “Our number is 0”, “Our number is 1”, “Our number is 2”, “Our number is 3”. When i is equal to 4, the continue statement comes into play and javascript skips that iteration. However, we used the continue statement and the iterations will continue until the increment reaches number 6, as defined in the body of the for loop. So, when i becomes 5 javascript tests the condition again and the continue statement is evaluated again – evaluation passes and the “Our number is 5” is on the output list. The same is true for i is 6. Afterward, the loop ends because i that enters testing conditions should be smaller than 7. In other words, with a for loop, the continue statement skips all the statements underneath it and pass the execution of the code to the update expression, in our case, that is i++.
What would happen if we were to use the break statement instead of continue? The break statement would jump out of a loop and the output would end at “Our number is 3”. The loop would not continue as it does with a continue statement where just one iteration in the loop is skipped.
Continue statement in a while loop
As we described in the paragraph above, in a for loop, javascript first evaluates the increment expression and then tests the condition to find out if another iteration should be done. But what happens with a continue statement in a while loop? In a while loop, including do…while loops, the continue statement skips the current iteration and the control flow of the program jumps back to the while condition, however, the condition is tested, and if it is true, the loop is executed again. Let’s see in an example what we’re talking about.
var car = ["BMW", "Mercedez", "Audi", "Toyota", "Volvo", "Ford", "Renault", "Opel"];
var i = 0;
var list = "";
while(i < car.length){
if (car[i] == "Toyota" || car[i] == "Renault") {
i++;
continue;
}
list = "";
list += car[i] + "
";
i++;
document.write(list);
} What do you expect to be the output? A list of cars that goes like this:
BMW
Mercedez
Audi
Volvo
Ford
Opel
In the example above, we are using the continue statement in the while loop. We defined an array “car”. The loop has several iterations, that begin with 0 and end at the array length. When iteration reaches “Toyota” or “Renault”, these values are because of the continue statement skipped, afterward, the condition is tested again and if it’s true, which is in our case, the loop is executed again, so the car list continues after “Toyota” with “Volvo” and “Ford” until it again reaches “Renault” when the listed iteration skipped, afterward tested for the next iteration and since it’s true, the list is continued with “Opel”.
Continue statement with a label
We’ve briefly mentioned earlier that we can use a continue statement with an optional label, which can be any valid identifier, in our case we used an outside label. At this point, it is worth mentioning that labeled continue is rarely used in JavaScript because it makes the code harder to read and understand. However, let’s see how a continue statement with a label works:
outside: for (let a = 1; a <= 3; a++) {
for (let = 1; b <= 3; b++) {
if ((a == 2) && (b == 2)) {
console.log('continue to outside');
continue outside;
}
console.log("[a:" + a + ",b:" + b + "]");
}
}The first thing we encounter here is the for loop, which increments the variable a and b from 1 to 3. The next thing we need to pay attention to is inside the body of the innermost loop, where we check if both a and b are equal to 2. When they are, JavaScript will output a message to the console and jump back to the outside label. When both a and b aren't equal to 2, JavaScript displays the values in each iteration. For example, when both a and b are equal to 3, the execution of the code jumps back to the expression i++ in the outside loop. The results of the code are shown in a combination of possible a and b values:
[a:1,b:1]
[a:1,b:2]
[a:1,b:3]
[a:2,b:1]
continue to outside
[a:3,b:1]
[a:3,b:2]
[a:3,b:3]Can we use a continue statement in a nested loop?
Yes, we can use a continue statement in a nested loop, but in this case, the continue statement skips the current iteration of the inner loop. Let's take a look at what we're talking about with an example:
// this is our first or outer loop with a variable a
for (let a = 1; a <= 3; a++) {
// this is our second or inner loop with a variable b
for (let b = 1; b <= 3; b++) {
if (b == 2) {
continue;
}
console.log("a = ${a}, b = ${b}");
}
}In the code above we declared we want the value b to be skipped when it reaches 2. This is why the value b = 2 is never displayed in the output below. So, in the example above, when the continue statement executes, the statement skips the current iteration in the inner or second loop and the control flow of the program moves to the updated expression of the inner loop:
// the output is:
a = 1, b = 1
a = 1, b = 3
a = 2, b = 1
a = 2, b = 3
a = 3, b = 1
a = 3, b = 3What is the takeaway message of the continue statement?
- The continue statement can only be used in loops, but when it is executed, it behaves slightly differently for different types of loops.
- In a while loop, the condition is tested, and if it is true, the loop is executed again.
- In a for loop, first, the expression is evaluated, and then the condition is tested to find out if another iteration should be done.
- The continue statement can also be used with an optional label reference, but due to harder code understanding, it is rarely used.
- The continue statement reminds of the break statement, however, the break statement "jumps out" of a switch() statement or simply ends a loop, while a continue statement only "jumps over" or skips a predefined iteration in a loop. In addition to that, when we use a label reference, we can use the break statement to jump out of any code block, not only loops.
- We can also use a continue statement in a nested loop.