Student Work

Lesson 25: Looping through an Array

So far, the only method for repeating code you have learned is the document.setInterval() function which runs code repeatedly after a specified time delay. This is how you set up the timer for the game loop. However, if you want to repeat code without a delay, you should use loops.

This loop would repeat 4 times. While x is less than 4, the code inside the while block is repeated, each time adding a * to the value of message. Once x becomes 4, the condition fails and the code after the while block is executed. In this case, '****' is displayed in an alert message.

Do/While loop

The do/while loop repeats code while a particular condition is true. This is different than the while loop however because it always runs the code in the loop at least one time, even if the condition is never true.

The for loop has three arguments inside the parenthesis and separated by semicolons. The first argument var i = 0 is used to declare a variable to be used as the counter and assign it an initial value. The second argument i<4 is the condition that determines whether to continue repeating the code in the for block. The loop continues to repeat while the condition is true. The third argument i++ changes the value of the counter. Normally, the counter is incremented by one as is done here, but the counter could be incremented or decremented by any value.

This loop repeates 4 times. The first time through the loop, i=0. The second time through the loop, i=1. The third time through the loop, i=2. The fourth time through the loop, i=3. Then '****' is displayed in an alert message.

Infinite loops

Make sure that the loops you write eventually stop. Loops that never stop are called infinite loops and will eventually crash the program. Here is an example of an infinite loop.

The code inside the loop set num to a random integer from 0 to 19, so the condition of num being less than 20 is always true. The loop will continue forever.

Looping through an Array

Notice that the variable used in the for loop above was i. While any variable could be used here, i is commonly used either for iteration or for index. For loops are often used to loop through (or iterate) an Array. Consider the ages Array.

ages

22

18

31

25

22

0

1

2

3

4

To loop through this Array, you would use a for loop with a counter that goes from 0 to 4. The code to loop through the Array to add up the values woud be:

Notice that we are using i as the index of the Array. The first time through the loop, i = 0 so ages[i] is 22. The second time through the loop, i = 1 so ages[i] is 18. The last time through the loop i = 4 so ages[i] is 22.

If you understand how to loop through an Array, then you are ready for this lesson, which has just one step!

1. Modify hitWall() to loop through all of the walls that are in the walls Array. This will ensure that the hittest is made with all of the walls, even when you continue adding more walls.

All should be working well now, and as you add walls the hitWall() function will automatically check all of the walls for a hit.