Labeled break and continue in Javascript - Step-by-Step Execution

Concept Flow - Labeled break and continue

Start Outer Loop

↓

Start Inner Loop

↓

Check Condition

↓

Action

↓

Continue Inner or Outer Loop

↓

End Inner Loop

↓

End Outer Loop

The labeled break or continue lets you jump out of or skip iterations in outer loops directly from inner loops.

Execution Sample

Javascript

outer: for(let i=1; i<=3; i++) {
  for(let j=1; j<=3; j++) {
    if(i===2 && j===2) break outer;
    console.log(i, j);
  }
}

This code prints pairs (i,j) but stops all loops when i=2 and j=2 using labeled break.

Execution Table

Step	i	j	Condition (i===2 && j===2)	Action	Output
1	1	1	false	Print (1,1)	(1,1)
2	1	2	false	Print (1,2)	(1,2)
3	1	3	false	Print (1,3)	(1,3)
4	2	1	false	Print (2,1)	(2,1)
5	2	2	true	Break outer loop

💡 At step 5, condition is true, so labeled break exits the outer loop entirely.

Variable Tracker

Variable	Start	After 1	After 2	After 3	After 4	After 5	Final
i	1	1	1	1	2	2	2
j	1	1	2	3	1

Key Moments - 2 Insights

Why does the loop stop completely at step 5 instead of just breaking the inner loop?

Because the break is labeled 'outer', it breaks the outer loop, not just the inner one, as shown in execution_table row 5.

What happens if we use 'continue outer' instead of 'break outer' at step 5?

The continue would skip the current iteration of the outer loop and start the next iteration, not exit all loops.

Visual Quiz - 3 Questions

Look at the execution table, what is the value of j at step 3?

A 2

B 3

C 1

D undefined

💡 Hint

Check the 'j' column in the execution_table row for step 3.

At which step does the labeled break cause the loops to stop?

A Step 3

B Step 4

C Step 5

D Step 2

💡 Hint

Look at the 'Action' column in execution_table to find when 'Break outer loop' happens.

If the condition was never true, how many times would the inner loop run for i=1?

A 3

B 1

C 2

D 0

💡 Hint

Check the 'j' values for i=1 in the execution_table rows 1-3.

Concept Snapshot

Labeled break and continue let you control outer loops from inner loops.
Syntax: labelName: for(...) { ... break labelName; ... continue labelName; }
'break labelName' exits the labeled loop.
'continue labelName' skips to next iteration of labeled loop.
Use to avoid complex flags or nested conditions.

Full Transcript

This example shows how labeled break works in JavaScript. We have two loops: outer and inner. The label 'outer' is placed before the outer loop. Inside the inner loop, we check if i equals 2 and j equals 2. If true, we break the outer loop using 'break outer;'. The execution table traces each step: printing pairs (i,j) until the condition is met. At step 5, the condition is true, so the labeled break exits both loops immediately. The variable tracker shows how i and j change each step. Key moments clarify why the labeled break stops all loops, not just the inner one. The visual quiz tests understanding of variable values and loop control. The concept snapshot summarizes how labeled break and continue work to control loops more flexibly.