JavaScript Loops
Loops in JavaScript are used to execute the same block of code
a specified number of times or while a specified condition is true.
Examples
For loop
How to write a for loop. Use a For loop to run the same block of code a specified number of times.
Looping through HTML headers
How to use the for loop to loop through the different HTML headers.
While loop
How to write a while loop. Use a while loop to run the
same block of code while a specified condition is true.
Do while loop
How to write a do...while loop. Use a do...while loop to run the same block of
code while a specified condition is true. This loop will always be executed once,
even if the condition is false, because the statements are executed before the
condition is tested.
JavaScript Loops
Very often when you write code, you want the same block of code to run
over and over again in a row. Instead of adding several almost equal lines in a script
we can use loops to
perform a task like this.
In JavaScript there is two different kind of loops:
- for - loops through a block of code a specified number of times
- while - loops through a block of code while a specified condition
is true
The for Loop
The for loop is used when you know in advance how many times the script
should run.
Syntax
for (var=startvalue;var<=endvalue;var=var+increment)
{
code to be executed
}
|
Example
Explanation: The example below defines a loop that starts with i=0. The loop
will continue to run as long as i is less than, or equal to 10. i
will increase by 1 each time the loop runs.
Note: The increment parameter could also be negative, and the <=
could be any comparing statement.
<html>
<body>
<script type="text/javascript">
var i=0
for (i=0;i<=10;i++)
{
document.write("The number is " + i);
document.write("<br />");
}
</script>
</table>
</body>
</html>
|
Result
The number is 0
The number is 1
The number is 2
The number is 3
The number is 4
The number is 5
The number is 6
The number is 7
The number is 8
The number is 9
The number is 10
|
The while loop
The while loop is used when you want the loop to execute and continue
executing while the specified condition is true.
while (var<=endvalue)
{
code to be executed
}
|
Note: The <=
could be any comparing statement.
Example
Explanation: The example below defines a loop that starts with i=0. The loop
will continue to run as long as i is less than, or equal to 10. i
will increase by 1 each time the loop runs.
<html>
<body>
<script type="text/javascript">
var i=0;
while (i<=10)
{
document.write("The number is " + i);
document.write("<br />");
i=i+1;
}
</script>
</table>
</body>
</html>
|
Result
The number is 0
The number is 1
The number is 2
The number is 3
The number is 4
The number is 5
The number is 6
The number is 7
The number is 8
The number is 9
The number is 10
|
The do...while Loop
The do...while loop is a variant of the while loop. This loop will
always execute a block of code ONCE, and then it will
repeat the loop as long as the specified condition is true. This loop will
always be executed once, even if the condition is false, because the code are
executed before the condition is tested.
do
{
code to be executed
}
while (var<=endvalue)
|
Example
<html>
<body>
<script type="text/javascript">
var i=0;
do
{
document.write("The number is " + i);
document.write("<br />");
i=i+1;
}
while (i<0);
</script>
</table>
</body>
</html>
|
Result
|