13.4 Programming Activity (20 mins)

Task:

Write a script to print numbers from 1 to 10 using all three loop types: for, while, and do-while.

Challenge:

Modify the script to print even numbers from 1 to 20 using a while loop and then a for loop.

Step-by-Step Activity:

Part 1: Print Numbers 1 to 10 Using Three Loop Types

Instructions:

  1. Create an HTML file (e.g., loops_activity.html) and write JavaScript code that prints numbers from 1 to 10 using for, while, and do-while loops.

  2. Example Code:

    <!DOCTYPE html>
    <html lang="en">
    <head>
      <meta charset="UTF-8">
      <meta name="viewport" content="width=device-width, initial-scale=1.0">
      <title>Loop Types Activity</title>
    </head>
    <body>
      <h1>Check the Console for Loop Output</h1>
    
      <script>
        // 1. For loop: Print numbers 1 to 10
        console.log("For Loop:");
        for (let i = 1; i <= 10; i++) {
          console.log(i);
        }
    
        // 2. While loop: Print numbers 1 to 10
        console.log("While Loop:");
        let j = 1;
        while (j <= 10) {
          console.log(j);
          j++;
        }
    
        // 3. Do-while loop: Print numbers 1 to 10
        console.log("Do-While Loop:");
        let k = 1;
        do {
          console.log(k);
          k++;
        } while (k <= 10);
      </script>
    </body>
    </html>
  3. 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 the output.

    • The console should display numbers from 1 to 10 for each loop type.

Part 2: Print Even Numbers from 1 to 20 Using while and for Loops

Instructions:

  1. Modify the script to print even numbers from 1 to 20 using a while loop and a for loop.

  2. Example Code:

    // 4. While loop: Print even numbers from 1 to 20
    console.log("While Loop (Even Numbers):");
    let x = 2;
    while (x <= 20) {
      console.log(x);
      x += 2;
    }
    
    // 5. For loop: Print even numbers from 1 to 20
    console.log("For Loop (Even Numbers):");
    for (let y = 2; y <= 20; y += 2) {
      console.log(y);
    }

Challenge:

  • Goal: The script should now print even numbers from 1 to 20 using both a while loop and a for loop.

  • Try Modifying the Loops:

    • Change the range (e.g., print even numbers from 1 to 50).

    • Use the loops to print odd numbers instead by adjusting the starting value and condition.


Activity Follow-up Questions:

  1. What are the differences in the syntax and execution of for, while, and do-while loops?

  2. How does the while loop handle even number generation compared to the for loop?

  3. In what scenarios would you choose one loop type over the others?

Expected Outcome:

Students will:

  • Practice writing and running for, while, and do-while loops to print numbers in sequence.

  • Understand how to modify loops to print only even numbers.

  • Learn how different loops handle iteration and when to use them.

Last updated