JavaScript Looping
Looping
Very often when you write code, you want the same block of code to run
a number of times. You can use looping statements in your code to do this.
In JavaScript we have the following looping statements:
- while - loops through a block of code while a condition is true
- do...while - loops through a block of code once, and then repeats the loop while a condition is true
- for - run statements a specified number of times
while
The while statement will execute a block of code while a condition is true..
while (condition)
{
code to be executed
}
|
do...while
The do...while statement will execute a block of code once, and then it will
repeat the loop while a condition is true
do
{
code to be executed
}
while (condition)
|
for
The for statement will execute a block of code a specified number of times
for (initialization; condition; increment)
{
code to be executed
}
|
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
<html>
<body>
<script type="text/javascript">
for (i=0; i<=5; i++)
{
document.write("<b>The number is " + i + "</b>")
document.write("<br>")
}
</script>
<p>Explanation:
<p>The for loop sets <b>i</b> equal to 0.
<p>As long as <b>i</b> is less than or equal to 5, the loop will continue to run.
<p><b>i</b> will increase by 1 each time the loop runs.
</body>
</html>
|
Looping through HTML headers
How to use the For loop to write the HTML headers.
<html>
<body>
<script type="text/javascript">
for (i=0; i<=6; i++)
{
document.write("<h" + i + ">This is header " + i)
document.write("</h" + i + ">")
}
</script>
<p>Explanation:
<p>The for loop sets <b>i</b> equal to 0.
<p>As long as <b>i</b> is less than or equal to 5, the loop will continue to run.
<p><b>i</b> will increase by 1 each time the loop runs.
</body>
</html>
|
While loop
How to write a While loop. Use a While loop to run the
same block of code while or until a condition is true
<html>
<body>
<script type="text/javascript">
i=0
while (i<=5)
{
document.write("<b>The number is " + i + "</b>")
document.write("<br>")
i++
}
</script>
<p>Explanation:
<p>The for loop sets <b>i</b> equal to 0.
<p>As long as <b>i</b> is less than or equal to 5, the loop will continue to run.
<p><b>i</b> will increase by 1 each time the loop runs.
</body>
</html>
|
Do while loop
How to write a Do While loop. Use a Do While loop to run the same block of code while
or until a 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
<html>
<body>
<script type="text/javascript">
i=0
do
{
document.write("<b>The number is " + i + "</b>")
document.write("<br>")
i++
}
while (i<=5)
</script>
<p>Explanation:
<p>The for loop sets <b>i</b> equal to 0.
<p>As long as <b>i</b> is less than or equal to 5, the loop will continue to run.
<p><b>i</b> will increase by 1 each time the loop runs.
</body>
</html>
|
|