The break and continue keywords give you fine-grained control over loop execution beyond the loop's normal condition. This lesson covers how break exits a loop entirely and how continue skips just the current iteration and moves on to the next.
1Break & Continue in JavaScript Part 1
Sometimes you need to control the loop flow more precisely. 'break' and 'continue' are your best friends for this.
Loop Control
2Break & Continue in JavaScript Part 2
The 'break' statement jumps out of the loop completely. Use it when you've found what you were looking for.
for (let i = 0; i < 10; i++) {
if (i === 3) break;
console.log(i);
}
// Prints 0, 1, 2The Break
3Break & Continue in JavaScript Part 3
'continue' skips the rest of the CURRENT iteration and jumps to the next one.
for (let i = 0; i < 5; i++) {
if (i === 2) continue;
console.log(i);
}
// Prints 0, 1, 3, 4The Continue
4Break & Continue in JavaScript Part 4
Flow controlled. Next: Reusable logic with Functions.
On to Functions
5Step-by-Step Breakdown
Sometimes you need to control the loop flow more precisely. 'break' and 'continue' are your best friends for this.
The 'break' statement jumps out of the loop completely. Use it when you've found what you were looking for.
'continue' skips the rest of the CURRENT iteration and jumps to the next one.
Checkpoint: Which keyword completely EXITS the loop?
Flow controlled. Next: Reusable logic with Functions.
Level Up š
Advanced cheat sheets, SEO tricks, and interview prep for this topic.
Browser Support
Fully supported.
Fully supported.
Fully supported.
Fully supported.
Accessibility (A11y)
1Use break to Stop Processing Once Enough Results Are Found, Reducing Unnecessary DOM Work
When a loop builds up UI elements or searches through DOM nodes, stopping with break as soon as the needed result is found avoids extra layout and paint work that could otherwise cause perceptible lag for users relying on assistive technology, where timing and responsiveness matter as much as for sighted users.
SEO Implications
- 1
Loop Control Flow Itself Has No Direct SEO Impact, But Runaway Loops Can Freeze Content Rendering
A loop missing a break condition (or one that should use continue to skip invalid data) can hang the main thread indefinitely, preventing the rest of the page's content from ever rendering ā which crawlers will see as a blank or broken page.
Best Practices
Use break to Exit Early Once a Search Loop Finds Its Target
Continuing to loop after you've already found what you're looking for wastes CPU cycles checking irrelevant remaining elements. Add a break as soon as the condition you're searching for is met, rather than letting the loop run to completion unnecessarily.
Prefer continue Over Deeply Nested if Blocks for Skipping Invalid Iterations
Wrapping the entire loop body in `if (isValid) { ... }` adds a layer of nesting for every single line of loop logic. Inverting the condition and using `if (!isValid) continue;` at the top lets the rest of the loop body stay unindented and easier to read.
Frequent Bugs
Using `break` inside a `.forEach()` callback and expecting it to stop the loop.
`break` is only valid syntax inside actual loop constructs (`for`, `while`, `for...of`) ā using it inside a `.forEach()` callback throws a SyntaxError because a callback function isn't a loop from the parser's perspective. Use a `for...of` loop instead when you need the ability to break early.
Placing `continue` inside a nested loop and expecting it to skip the outer loop's iteration instead of the inner one.
By default, `continue` (like `break`) only affects the nearest enclosing loop. To target an outer loop from inside a nested one, label the outer loop (`outer: for (...) { ... }`) and use `continue outer;`.
Real-World Examples
Using break to Stop Searching Once a Match Is Found
A function needed to find the first user in a large array whose email matched a search string and stop scanning immediately once found, rather than checking every remaining user unnecessarily.
let foundUser = null;
for (const user of users) {
if (user.email === searchEmail) {
foundUser = user;
break;
}
}