JavaScript For Loop
The loop can execute the code block a specified number of times.
JavaScript Loop
If you want to run the same code over and over again, and the value is different each time, it is convenient to use a loop.
We can output the value of the array like this:
General writing:
document.write(cars[0] + "<br>"); document.write(cars[1] + "<br>"); document.write(cars[2] + "<br>"); document.write(cars[3] + "<br>"); document.write(cars[4] + "<br>"); document.write(cars[5] + "<br>");
Example - Use for Loop
for (var i=0;i<cars.length;i++) { document.write(cars[i] + "<br>"); }
Different Types of Loops
JavaScript supports different types of loops:
for - loop the code block a certain number of times
for/in - loop through the properties of an object
while - loop the specified code block when the specified condition is true
do/while - also loop the specified code block when the specified condition is true
For Loop
The for loop is a tool you will often use when you want to create a loop.
The following is the syntax of the for loop:
for (statement 1; statement 2; statement 3)
{
executed code block
}
Statement 1: Executes before (code block) starts
Statement 2: Defines the conditions for running the loop (code block)
Statement 3: To be executed after the loop (code block) has been executed
Example
for (var i=0; i<5; i++) { x = x + "The number is "+ i + "<br>"; }
From the above example, you can see:
Statement 1: Set the variable (var i=0) before the start of the loop.
Statement 2: Defines the conditions for loop operation (i must be less than 5).
Statement 3: Adds a value (i++) each time the code block has been executed.
Statement 1
Usually we will use statement 1 to initialize the variables used in the loop (var i=0).
Statement 1 is optional, which means that statement 1 is not required.
You can initialize any (or multiple) values in statement 1:
Example
for (var i=0,len=cars.length; i<len; i++) { document.write(cars[i] + "<br>"); }
You also can omit statement 1 (for example, when the value is already set before the loop starts):
Example
var i=2,len=cars.length; for (; i<len; i++) { document.write(cars[i] + "<br>"); }
Statement 2
Usually statement 2 is used to evaluate the condition of the initial variable.
Statement 2 is also optional.
If statement 2 returns true, the loop will start again, if it returns false, the loop will end.
![]() | If you omit statement 2, then you must provide break inside the loop . Otherwise, the cycle cannot be stopped. This may crash the browser. Please read about break later in this tutorial. |
---|
Statement 3
Usually statement 3 will increase the value of the initial variable.
Statement 3 is also optional.
Statement 3 has multiple uses. The increment can be negative (i--) or greater (i=i+15).
Statement 3 can also be omitted (for example, when there is a corresponding code inside the loop):
Example
var i=0,len=cars.length; for (; i<len;) { document.write(cars[i] + "<br>"); i++; }
for / in loop
The JavaScript for/in statement loops through the properties of an object:
Example
var person={fname:"Bill",lname:"Gates",age:56}; for (x in person) // x is the attribute name { txt=txt + person[x]; }
You will learn more about for / in loops in the chapter on JavaScript objects.
while Loop
We will explain to you the while loop and do/while loop in the next chapter.