3.4.5 Iterative Statement

This topic explains iterative statements in JavaScript, focusing on the `for` loop, which repeats a block of code multiple times based on an index, a terminating condition, and a step-size.

Definition

Iterative Statement: An iterative statement like 'For Loop' is used to get similar kind of task done. Rather than writing the same line of code multiple times, the same task is achieved in much lesser line of code.

Core Concept

An iterative statement is like a treadmill. Instead of running around the block 10 times by writing "run around the block" 10 times, you just say "run around the block 10 times." The `for` loop works the same way: you set a starting point (index), a stopping condition, and how much to increase each time (step-size). The loop then repeats the task automatically until the condition is met. This saves time and keeps code short and clean.

Detailed Explanation

The `for` Loop

The 'for loop' works on the basis of an index, which you can initialize in the loop. Next is the terminating condition which needs to be set for the loop to terminate. Lastly, step-size needs to be defined that how many steps the index will take after each iteration; till the terminating condition is met.

Syntax: ```javascript for (initialization; condition; step) { // code to repeat } ```

Parts of a `for` Loop:

Example: Simple For-Loop

In the following example, the 'for loop' initializes an index to 0, the value of index will increment by 1, and the loop will execute till the index value remains less than 10.

```html <html> <body> <script type="text/javascript"> var index; document.write("For-Loop Starts After This ... <br />"); for(index = 0; index < 10; index=index+1) { document.write("Index No. :", index, "<br />"); } document.write("For-Loop Stopped!"); </script> </body> </html> ```

Output: For-Loop Starts After This ... Index No. : 0 Index No. : 1 Index No. : 2 Index No. : 3 Index No. : 4 Index No. : 5 Index No. : 6 Index No. : 7 Index No. : 8 Index No. : 9 For-Loop Stopped!

• `index = 0` — starts at 0.
• `index < 10` — continues while index is less than 10.
• `index = index + 1` — increases index by 1 each time.
• The loop runs 10 times (0 to 9).

Example: For-Loop with Step-Size of 2

Alternatively, we can decrease the index value and set the condition accordingly. In the code below, we increased the step-size, too.

```html <html> <body> <script type="text/javascript"> var index; document.write("For-Loop Starts After This ... <br />"); for(index = 10; index > 0; index=index-2) { document.write("Index No. :", index, "<br />"); } document.write("For-Loop Stopped!"); </script> </body> </html> ```

Output: For-Loop Starts After This ... Index No. : 10 Index No. : 8 Index No. : 6 Index No. : 4 Index No. : 2 For-Loop Stopped!

• `index = 10` — starts at 10.
• `index > 0` — continues while index is greater than 0.
• `index = index - 2` — decreases index by 2 each time.
• The loop runs 5 times (10, 8, 6, 4, 2).

Common Uses of `for` Loops

Example: Sum of Numbers

```html <html> <body> <script type="text/javascript"> var sum = 0; for(var i = 1; i <= 10; i++) { sum = sum + i; } document.write("Sum of 1 to 10 is: ", sum); </script> </body> </html> ```

Output: Sum of 1 to 10 is: 55

Example: Multiplication Table

```html <html> <body> <script type="text/javascript"> var num = 5; document.write("Table of ", num, "<br />"); for(var i = 1; i <= 10; i++) { document.write(num, " x ", i, " = ", num * i, "<br />"); } </script> </body> </html> ```

Output: Table of 5 5 x 1 = 5 5 x 2 = 10 5 x 3 = 15 ... 5 x 10 = 50

Intermediate Level

The `for` loop is an iterative statement that repeats a block of code. It has three parts: initialization (starting value), condition (loop continues while true), and step (how the index changes). The loop runs until the condition becomes false. You can increment or decrement the index, and use any step-size. Common uses include counting, summing, iterating arrays, and printing tables. The `for` loop reduces code repetition and makes programs shorter and more efficient.

Important Points

• - `for` loop = repeat code multiple times.
• - Three parts: initialization, condition, step.
• - Initialization: sets starting value.
• - Condition: loop continues while true.
• - Step: how index changes each iteration.
• - Can increment (`index++`) or decrement (`index--`).
• - Step-size can be any value (1, 2, etc.).
• - Common uses: counting, summing, iterating arrays, printing tables.

Remember

• - For Loop: `for(init; condition; step)`.
• - Init: `index = 0`.
• - Condition: `index < 10`.
• - Step: `index = index + 1` or `index++`.
• - Decrement: `index = index - 2` or `index -= 2`.
• - Example: Print 0–9: `for(index=0; index<10; index++)`.
• - Example: Print 10, 8, 6, 4, 2: `for(index=10; index>0; index-=2)`.

Common Mistakes

• - Infinite loop: Forgetting to update the index, so the condition never becomes false.
• - Off-by-one error: Using `<` instead of `<=` or vice versa.
• - Wrong step direction: Using `+` when you should use `-`.
• - Forgetting braces `{ }`: Only the first line after `for` is repeated without braces.
• - Using `=` instead of `==` in condition: `=` assigns; `==` compares.
• - Modifying index inside the loop: Can cause unexpected behavior.

Quick Revision

The `for` loop is an iterative statement that repeats a block of code. It has three parts: initialization (starting value), condition (loop continues while true), and step (how the index changes). The loop runs until the condition becomes false. You can increment or decrement the index with any step-size. Common uses include counting, summing, iterating arrays, and printing tables.

60-Second Revision

• For Loop: `for(init; condition; step)`.
• Parts:
• - Initialization: `index = 0`
• - Condition: `index < 10`
• - Step: `index++` or `index += 2`
• Example: Print 0–9: `for(i=0; i<10; i++)`.
• Example: Print 10, 8, 6, 4, 2: `for(i=10; i>0; i-=2)`.
• Key Point: The `for` loop repeats code efficiently; ensure the condition eventually becomes false to avoid infinite loops.