For Loop in JavaScript

JavaScript for loop repeats a group of statements until a specified condition evaluates to false.  The for loop allows us to specify an initialization expression, condition, and final expression as part of the loop syntax.

For Loop

The syntax of the for loop is as below.

It starts with for keyword followed by three optional expressions inside parentheses separated by semi-colons. Finally, a block of statements inside curly braces follows them. These block statements execute for each iteration of the loop.

The three optional expressions are

1. Initial-expression
2. Condition
3. Final-expression

Initial Expression

The initial-expression is the expression, that JavaScript executes at the beginning of the loop. It runs only once.

1. Initial-expression is optional
2. You can execute any expression here including complex expressions.
3. The main purpose of it to initialize the loop counters using assignment expressions
4. You can also declare variables here using var & let.
5. Variables declared with let are local to the statement.
6. Variables declared with var are not local to the loop, You can access them outside the loop also
7. The result of this expression is discarded.

Condition

The condition is evaluated before the beginning of each iteration of the loop. If the condition returns true, then it executes the block of statements. If returns false the loop terminates.

condition is optional. An empty condition returns true.

Final Expression

For Loop executes the final expression at the end of each iteration of the loop and before the next evaluation of the condition

The main purpose of it is to increment or update the loop counter.

Statements

A statement that is executed as long as the condition evaluates to true.

Use the block { ... } to group the multiple statements together. For a single statement, no need to use { ... }

You can also use an empty statement just by adding ;

How it works

When a For loop executes, the following occurs

1. Executes the initial-expression. This runs only once
2. Evaluates the condition. If the value is True then continue to step 3. If false the loop terminates.
3. Executes the statements.
4. Executes the final-expression.
5. Control returns to Step 2.

For Loop Example

1. The expression let i = 0 is the initial-expression and runs only once. It initializes the loop local variable i with a value of 0
2. i < 5 is the condition, which returns true as long as the i is less than 5. Hence the loop continues. If it returns false, the loop terminates.
3. The loop runs for the first time and statements inside the { } executes.
4. The final-expression i++ executes. Which increments the value of i by 1
5. Now, the control returns to step 2

let is local to the for loop

In the example above we used the let to declare the loop variable i. Hence its scope is local to the loop body. Trying to use outside the loop will result in the error Error: i is not defined.

var is available outside the for loop.

We can also use var to declare the variable, in that case, you can use the variable outside the For loop.

Initial expression is optional

We can also initialize the initial value outside the for loop and keep the initial-expression empty

Condition is also optional

The condition is also optional, But an empty condition is treated as True. Hence this will create an infinite loop

Use Break statement to break out of the loop

You can use the break statement to break out of a For loop.

Final Expression is also optional

In the following example Initial Expression, condition & final expression is empty.

We initialize the value of the counter before entering the loop. Check the condition in the loop body. Also, execute the Final expression as the last statement of the loop.

The above is equivalent to the following code.

Skipping an Iteration

Use the continue statement to skip the rest of the for loop and move over to the next iteration. The following example, will not print the 0 & 1.

Loop Backwards

You can also go backward. Start the count from 5 and decrement in each iteration.

Complex Expressions

We can also include complex expressions in Initial & final expressions

Statement body is also optional

In the following code, we do not have for the body.

For Loop More Examples

Reference

For