❮ Previous Next ❯

JavaScript Looping Statements

  • This lesson covers different looping structures in JavaScript.

  • Introduction to Loops

    In programming, many times we need to repeat the same task multiple times.

    For example:

    • Printing numbers from 1 to 10

    • Displaying a list of students

    • Calculating total marks

    • Running a block of code until a condition becomes false

    Writing the same code again and again is not practical.

    This is where loops are used.

    What is a Loop ?

    A loop is a control structure that allows us to execute a block of code repeatedly as long as a given condition is true.

    Why Are Loops Important ?

    Without loops:

    • Code becomes lengthy

    • Repetition increases

    • Maintenance becomes difficult

    With loops:

    • Code is short and clean

    • Logic becomes simple

    • Reusability increases

    • Performance improves

    Types of Looping Statements in JavaScript

    JavaScript provides the following looping statements:

    1. for loop

    2. while loop

    3. do-while loop

    Each loop has a different use case.

    Loop Control Components

    Every loop is based on three main parts:

    1. Initialization - starting point

    2. Condition - decides how long the loop runs

    3. Update - changes the loop variable

      for Loop

      What is a for Loop ?

      A for loop is used when the number of iterations is known in advance.

      It is the most commonly used loop in JavaScript.

      Syntax of for Loop

      for (initialization; condition; update) {

        // code to be executed

      }

      How for Loop Works

      1. Initialization runs once

      2. Condition is checked

      3. If condition is true → code executes

      4. Update runs

      5. Condition is checked again

      6. Loop continues until condition becomes false

    for Loop

    Repeats a block of code a fixed number of times using a counter. 

    // Print numbers from 1 to 5

for (let i = 1; i <= 5; i++) {
  console.log(i);
}

    • Explanation

      • let i = 1 → initialization

      • i <= 5 → condition

      • i++ → update

        When to Use for Loop ?

        • When loop count is fixed

        • When working with arrays (basic level)

        • When logic is straightforward

        while Loop

        What is a while Loop ?

        A while loop executes a block of code as long as the condition is true.

        The condition is checked before executing the loop body.

        Syntax of while Loop

        while (condition) {

          // code to be executed

        }

      while Loop

      Executes code repeatedly as long as the condition remains true. 

      // Print numbers from 1 to 5 using while loop

let i = 1;

while (i <= 5) {
  console.log(i);
  i++;
}

      • Explanation

        • Condition checked first

        • If condition is false initially, loop will not run

      Countdown using while

      Decreases a value step by step until it reaches zero. 

      // Countdown program

let count = 5;

while (count > 0) {
  console.log(count);
  count--;
}

      • Important Point About while Loop

        If the update statement is forgotten, it may cause an infinite loop.

        Infinite Loop Example (Do NOT Run)

        let i = 1;

        while (i <= 5) {

          console.log(i);

        }

        Reason: i is never updated.

        When to Use while Loop ?

        • When number of iterations is unknown

        • When loop depends on a condition

        • When input-driven logic is required

      • do-while Loop

        What is a do-while Loop ?

        A do-while loop executes the code block at least once, even if the condition is false.

        The condition is checked after executing the loop body.

        Syntax of do-while Loop

        do {

          // code to be executed

        } while (condition);

      do...while Loop

      Executes the code at least once before checking the condition. 

      // Print numbers from 1 to 5 using do...while

let i = 1;

do {
  console.log(i);
  i++;
} while (i <= 5);
      • Condition False but Code Runs Once

      do...while Runs At Least Once

      Executes the block once even if the condition is false from the start. 

      // Condition is false but loop runs once

let num = 10;

do {
  console.log("This will run once");
} while (num < 5);

      • Why Did it Run ?

        Because do-while executes the code before checking the condition.

        When to Use do-while Loop ?

        • Menu-driven programs

        • User input validation

        • When at least one execution is required

          Comparison: for vs while vs do-while

          Featurefor Loopwhile Loopdo-while Loop
          Condition checkBeforeBeforeAfter
          Guaranteed executionNoNoYes (once)
          Best forKnown iterationsUnknown iterationsAt least one run
          UsageMost commonCondition-basedInput-based

          Common Mistakes

          • Forgetting update statement

          • Writing wrong condition

          • Creating infinite loops

          • Using wrong loop type

          Best Practices for Loops

          • Use meaningful variable names

          • Avoid infinite loops

          • Keep loop body simple

          • Use correct loop type

          • Test conditions carefully

          Real-Life Analogy

          • for loop: Attendance for 30 students

          • while loop: Fill water until tank is full

          • do-while loop: Show menu at least once

        ❮ Previous Next ❯