JavaScript Loops

JavaScript Loops


Control structures are simply the deciding factors for what sets of codes are going to be used and how they are going to be used. These structures consist of:

  • if else statement
  • while loop
  • for loop

These three control structures are very similar. Each of the three control structures has its own specific format and its own special uses.

If else statement

The IF statement is used to conditionally execute a block of code. A BLOCK is the set of codes within the { braces }.

The simple IF statement consists of a conditional expression (TRUE or FALSE) and a block of code which is executed IF that expression is TRUE.

The conditional expression can be any variable that holds a logical value such as TRUE or FALSE. Numerical expressions can also be used. 0 is FALSE and all other values are TRUE.

Here is an example of the IF statement:

This example uses 2 conditional statements. The && stands for AND. So BOTH expressions must have a TRUE value to execute the IF block of code.

IF the value of x is less than 10 AND the value of x is greater than 0, then execute this block of code.

What IF the expression value is FALSE? In that case, an ELSE clause will be needed. One block of code is executed IF the value is TRUE, and a second block is executed IF the value is FALSE.

Here is an example of the IF statement with an ELSE clause:

IF both expressions produce a TRUE value, the regular block of code will be executed. IF one or both of the expressions have a FALSE value, thus creating a total FALSE value, the code block in the ELSE section will be executed.

Setting the variable y to null is a precautionary measure. If it had a value in it already from a previous expression test, this will reset it to nothing.

while loop

The while statement is used to execute a block of code while a certain condition is true. The difference between a WHILE statement and an IF statement is : the WHILE block may be executed many times. The IF...ELSE blocks are executed once.

The expression is tested for a TRUE or FALSE value. If it is TRUE then the block of code is executed. The control then loops back to the top of the WHILE statement. The expression is then evaluated again.

This process continues until the expression becomes FALSE, or until some statement within the block forces it to terminate.

This will produce the word Hello to be written 10 times. The WHILE statement checks to see if x is less than or equal to 10. WHILE that expression holds true, do this block of code. The block has an x++ command. This is the same as saying x=x+1 or increase the value of x by 1. In this case, x is being used as a counter. Once the x counter is over 10, the expression becomes FALSE and the command process can continues on past the WHILE loop.

The WHILE statement can be totally passed over if the expression is FALSE to begin with. Another situation that allows an early "break out" of a WHILE statement is a BREAK command. These are generally created by a second CONTROL condition nested with the main one.

This creates the same output as the previous examples. The point is to show how an inner condition can break the circle of the main loop.

Setting TRUE as the expression creates an unlimited loop. The variable called TEMP increases by 1 each time the loop goes around. IF the value of temp becomes greater than 10, then BREAK jumps the control out of the WHILE loop.

Using the WHILE loop may cause problems though. Since the WHILE expression is set to TRUE, there is no way for the while to terminate unless the break statement is executed. If the break statement is not entered or a false number is entered, the BREAK will never happen and the WHILE loop will go on forever.

The CONTINUE statement is a special statement that may be used inside WHILE loops. If you were playing Monopoly, it would be the same effect as an "Advance to GO" card. When a CONTINUE is found, any coding toward the end of the WHILE loop is skipped and the power goes back up to the top of the WHILE loop.

In this example, all the odd numbers between 1 and 10 are added together.

  1. Variables are set at starting numbers.
  2. The WHILE loop tests for a number lower than 10.
  3. IF the number divided by 2 MATCHES the remainder THEN a. increase the remainder count for the next test. b. CONTINUE (ignore the remaining and go back to the WHILE start.
  4. Add the current number to the running total.
  5. When the WHILE loop is done, display the total.

for Loop

The for loop is the more complex of the three control structures. Here is the basic outLIne of it :

The initialize property is always executed exactly once when the for statement is first encountered. It is used to start a variable condition (the starting point of a FOR loop).

The condition property is a conditional test, and serves exactly the same function as in the while statement. It is tested at the top of each loop. The loop terminates when this condition evaluates as false. (The ending point of a FOR loop).

The increment statement is executed at the end of each loop. As if it were placed immediately after the last statement in the FOR block. It is used to update the variable in the initialize property. (The increase or step value each loop).

Here is an example that adds the numbers from 1 to 10 using a FOR loop:

The FOR loop is very similar to the WHILE loop. It is possible to use the BREAK and CONTINUE properties within a FOR loop. One of the advantages of a FOR loop is that its update statement is executed on every pass through the loop, even those passes that are cut short by a CONTINUE. The CONTINUE skips every statement in the block, but it does not cause the update statement to be skipped. As Like the other loop controls, the coding of them should ensure an escape. An endless loop is not usually the desired result.

The FOR loop also has some unique features.

  1. Variables may actually be declared in the initialize area. Declaring the "var x;" (from the above example) before the loop isn't necessary if the variable is only being used for THAT loop only.
  2. Both the initiaLIzation portion and the update portion of the FOR loop may contain multiple statements separated a comma.

This example uses 2 variables. One to add all the numbers from 1 to 10. The other to add only the "even" numbers.

Table of Contents

JavaScript Arrays