13.5 Break and Continue in Loops (10 mins)

Introduction to break and continue Statements:
- Break: Exits a loop completely, stopping its execution.
  - Use case: When you want to terminate the loop early, such as when a certain condition is met.
  - Example:
    for (let i = 1; i <= 10; i++) { if (i === 5) { break; // Exit the loop when i equals 5 } console.log(i); // Outputs: 1, 2, 3, 4 }
- Continue: Skips the current iteration and moves to the next iteration of the loop.
  - Use case: When you want to skip certain values or conditions, but keep the loop running.
  - Example:
    for (let i = 1; i <= 5; i++) { if (i === 3) { continue; // Skip the current iteration when i equals 3 } console.log(i); // Outputs: 1, 2, 4, 5 (skips 3) }
How break and continue Work in Loops:
- Break: Stops the loop entirely and moves execution to the next part of the program.
- Continue: Skips the rest of the code in the current loop iteration but continues with the next iteration.
When to Use break and continue:
- Break: Use when you need to stop a loop once a certain condition is met (e.g., finding a specific value in an array).
- Continue: Use when you need to skip over certain elements in the loop (e.g., filtering out invalid inputs).

Student Activity (10 mins):

Objective: Incorporate break and continue statements into the previous loops to control the flow of iteration.

Step-by-Step Activity:

Modify the Previous Loops to Include break and continue:
Instructions:
- Open your previous HTML file (loops_activity.html) and update the script to include break and continue statements.

Example Code:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Break and Continue in Loops</title>
</head>
<body>
  <h1>Check the Console for Loop Output</h1>

  <script>
    // 1. For loop: Break when i reaches 7
    console.log("For Loop with Break:");
    for (let i = 1; i <= 10; i++) {
      if (i === 7) {
        break;  // Stop the loop completely when i equals 7
      }
      console.log(i);  // Outputs: 1, 2, 3, 4, 5, 6
    }

    // 2. For loop: Continue to skip even numbers
    console.log("For Loop with Continue:");
    for (let i = 1; i <= 10; i++) {
      if (i % 2 === 0) {
        continue;  // Skip even numbers
      }
      console.log(i);  // Outputs: 1, 3, 5, 7, 9
    }

    // 3. While loop: Break when j reaches 5
    console.log("While Loop with Break:");
    let j = 1;
    while (j <= 10) {
      if (j === 5) {
        break;  // Exit the loop when j equals 5
      }
      console.log(j);
      j++;
    }

    // 4. Do-While loop: Continue to skip odd numbers
    console.log("Do-While Loop with Continue:");
    let k = 1;
    do {
      if (k % 2 !== 0) {
        k++;
        continue;  // Skip odd numbers
      }
      console.log(k);
      k++;
    } while (k <= 10);
  </script>
</body>
</html>

Run the file in a browser:
- Open the HTML file in a browser and use Developer Tools (F12 or right-click and select Inspect > Console) to view how break and continue statements affect the loop’s behavior.

Challenge:

Write a Loop to Find the First Number Divisible by Both 3 and 5:

Use the break statement to exit the loop once a number divisible by both 3 and 5 is found.

Example:

for (let i = 1; i <= 100; i++) {
  if (i % 3 === 0 && i % 5 === 0) {
    console.log(i + " is divisible by both 3 and 5");
    break;  // Stop after finding the first match
  }
}

Write a Loop to Skip All Multiples of 4:

Use the continue statement to skip numbers divisible by 4.

Example:

for (let i = 1; i <= 20; i++) {
  if (i % 4 === 0) {
    continue;  // Skip multiples of 4
  }
  console.log(i);  // Outputs numbers that are not divisible by 4
}

Activity Follow-up Questions:

How does the break statement impact the flow of a loop compared to continue?
Can you think of a real-world example where you would want to use break to stop a loop early?
In what scenarios would you use continue to skip certain iterations while still completing the loop?

Expected Outcome:

Students will:

Understand how to control loop flow using break to stop execution early and continue to skip specific iterations.
Apply these concepts to modify existing loops and solve real-world problems that require breaking or skipping certain conditions.

Previous13.4 Programming Activity (20 mins)Next13.6 Loop Optimization (10 mins)

Last updated 1 year ago