Looping is a core process in any programming language. Loops are handy for cutting down on the writing of repetitive code. Loops are often used in conjunction with arrays and if you have not yet read the arrays page you should do so now.
Loops reitterate code as long as a condition is true, so every loop contains a conditional statement. These conditionals determine how many times should a block of code loop or that a loop should repeat its block of code until a certain condition occurs.
The for loop executes a block of code a set number of times. As a result it is this loop which is most commonly used in conjunction with arrays. Here is how a for loop should be programmed:
for (var i = 0; i <= 7; i++) {
// code to repeat
}
This is a quite dense piece of code so lets break it down a bit.
After the for statement and inside the brackets there are three statements seperated by semi-colons (as each is a statement in it's own right). A for loop will always require these three statement.
The first statement var i = 0; defines a new variable i. This variable will be used to keep track of how many times the for loop has been run. In this case this variable is set to 0.
The next statement, i < 7 is the comparison for this loop. It askes if the value of i is less than 7. If i is in fact less than 7 then the for loop will run the code it contains. If the value of i is 7 or greater the for loop will end.
The final statement tells the variable i how to behave at the end of each loop (called an itteration). In this case the value of i is increased by 1 using the ++ arithmatic operator.
Here is an example which uses an array and a for loop to print the days of the week.
<script language="javascript" type="text/javascript">
// define an array containing the days of the week
var daysofweek = new Array("Sunday","Monday","Tuesday","Wednesday",
"Thursday","Friday","Saturday");
// define a for loop which will itterate 7 times
for (var i = 0; i < 7; i++) {
// i is visible inside the for loop, but not outside. As i starts
// at 0 we add 1 to it to make it a meaningful number to display
// if we don't do this Sunday becomes day 0 of the week.
var thisday = i + 1;
// access the array using i to determine which item to get from
// the list and add this to some HTML code to form a sentence
document.write("<p>" + daysofweek[i] + " is the " +
thisday + " day of the week</p>");
}
</script>
Loops are very useful for working over lists using only a very small block of code.
Now open the loops exercise page and work through it.
You may also use the JavaScript scratch pad to try out code quickly.
The while loop is the opposite of the for loop in that it will continue to loop as long as its given condition remains true. For example:
// define an array containing the days of the week
var index = 0;
// define a while loop with a condition of index being less than 19
while (index < 19) {
// write out the current value of index
document.write("<p>Now index = " + index + "</p>");
// if we don't increase index we will caise an infinte loop
// which will freeze the browser
index += 2;
}
It is very easy to create infinite loops using the while statement. Infinite loops will fill the browser's memory and crash it!
Now open the loops exercise page and work through it.
You may also use the JavaScript scratch pad to try out code quickly.