for (...) { ... } Loops

The for loop provides a construct that will run a statement block multiples times. It is particularly useful for processing enumerated data structures such as arrays.

A for loop contains a counter variable that must initiated. It will increment with every iteration of the loop and terminate the loop when the maximum number of iterations has been reached.

The loop declaration consists of three parts:

1. the counter variable initialization (ending with a semicolon)
2. a test condition that determines when the loop terminate (ending with a semicolon)
3. a statement determining the increment of the counter variable at the end of each loop

This declaration, which follows the for keyword, is stated in parenthesis; it is followed by the statement block to be executed in curly brackets.

for (var i = 0; i < 10; ++i)
{
  ... code of loop goes here ...
}

The example loop starts counting at 0 (variable i), continues to loop while i < 10, increments i by 1 at the end of every iteration (++i), and will terminate when i has reached 10.

A typical use of a for loop is to process data in an array. The following example iterates over every element of the array variable myArray

for (var i = 0; i < myArray.length; ++i)
{
  ... code of loop goes here ...
}

for loops are not bound to proceed stepwise in an ascending manner, as in the example shown. You may define the increment by whatever is appropriate to your data. ++i is shorthand for i = i + 1, a simple assignment statement. It could also be i = i + n, or i = i + (myArray.length / 2)--in short, any numerical value that is appropriate for processing your data and in accordance with the syntax rules of the programming language.

Incidentally, this means that you don't have to traverse numerically organized data in an ascending manner. You can also do it from the highest value to the lowest. In reverse, the loop shown above would look like this (--i being a decrement operator):

for (var i = myArray.length; i >= 0; --i)
{
  ... code of loop goes here ...
}

Example:

A simple ascending loop sequence:

Code:

<script type="text/javascript">
<!--
function simpleForLoop(num)
{   
  for (var i = 0; i < parseInt(num); ++i)
  {
    document.write("Loop iteration " + i + "<br>");
  }
  document.close();
  return true;
}
//-->
</script>

continue and break

There are two keywords with which the behavior of for loops can be manipulated, continue and break. Both keywords are placed inside the code block that the loop executes.

for ( ... ) { ... continue; ... }

continue is usually combined with an if statement that evaluates the state of some data. When continue is executed, it skips all subsequent statements of the loop and increments the loop counter. Then the normal loop execution resumes.

In the following example, the printing command is skipped when the counter variable is divisible by 2. The if statement checks the remainder of the division of i via the % (modulo) operator. If % returns 0, continue is invoked and the remaining code of the loop is skipped.

Example:

Code:

function forContinueLoop(num)
{
  for (var i = 0; i < parseInt(num); ++i)
  {
    if (i % 2 == 0)
    {
      continue;
    }
    document.write("Loop iteration " + i + "<br>");
  }
  document.close();
  return true;
}

for ( ... ) { ... break; ... }

break works just like the continue statement, but it does not just skip the remaining loop statements, it terminates the loop.

Example:

Code:

function forBreakLoop(num)
{
  for (var i = 1; i <= parseInt(num); ++i)
  {
    if (i == Math.round(num/2) + 1)
    {
      break;
    }
    document.write("Loop iteration " + i + "<br>");
  }
  document.close();
  return true;
}