Using Loops in ActionScript 3.0

By Blue_Chi | Flash CS3 | ActionScript 3.0 | Beginner

A loop is a tool used to execute a segment of code repeatedly for a specific number of times or while a certain condition is satisfied. Using a loop saves time and effort as the same code will not have to be typed multiple times for it to be executed repeatedly. This tutorial will teach you the basic usage of the five types of loops available for use in ActionScript 3.0.

This tutorial is divided into the following sections:

  1. Basic Loop Usage
  2. "For" Loop
  3. "While" Loop
  4. "Do While" Loop
  5. "For Each In" Loop
  6. "For In" Loop
  7. Using Variables with Loops

Basic Loop Usage

If it wasn't for loops you would have to repeat a statement multiple times if you want to have an action executed more than once. For example, say that you want to create ten MovieClips and add them to the display list. The long way for doing this would have been to type the command ten times:

addChild(new MovieClip());
addChild(new MovieClip());
addChild(new MovieClip());
addChild(new MovieClip());
addChild(new MovieClip());
addChild(new MovieClip());
addChild(new MovieClip());
addChild(new MovieClip());
addChild(new MovieClip());
addChild(new MovieClip());

However, you can do the same exact thing using a loop without having to type the same code multiple times:

for (var i:Number=1; i<=10;i++){
addChild(new MovieClip());
}

This second code generates the same exact result, but in a much more compact way. Using a loop also makes it less likely for you to have typing errors because you type the code once and then it is automatically repeated.

There are five different loop types, we are going to explain how to create each of them in turn.

The "For" Loop

The for loop is most widely used loop format because of its very compact form and because it is the easiest one to understand and use. You can use use this loop to execute a number of code statements multiple times using this format:

for (counter; condition; action){
statements;
}

Each for loop must have a counter (also called an iterator). This counter can be any number variable. You can define this counter when you create the loop:

for (var i:Number=0; condition, action){
statements;
}

Or alternatively you can define the counter before hand and just reset it when you want to use it in the loop:

var i:Number;
for (i=0; condition, action){
statements;
}
You can learn more about AS3 Variables by reviewing our tutorial on this topic.

The second element in the loop is a condition. The loop will only run while that condition is satisfied. For example, if you want your loop to run ten times you will need to state that i must not be greater than ten:

for (var i:Number=0; i<10 , action){
statements;
}

Finally, you have to specify the action by which i will increase, decrease, or multiply. In most simple cases you would have this value increase by one. This command is executed after each loop cycle.

for (var i:Number=0; i<10 , i++){
statements;
}
The action you set to i must eventually unsatisfy the condition, so in our example, by increasing the value of i we will eventually make it not less than 10. If your loop definition does not eventually fail the condition, your will have an infinite loop that will cause the player to crash.

Your loop has now been defined and you can put any code inside it to have play repeatedly.

for (var i:Number=0; i<10 , i++){
new MovieClip();
}

It is very common to make use of the i counter inside the loop. As the value of i will increase by 1, it is usually helpful to have each of your objects have a unique name by the value of i in its name. For example, if we wanted to have our MovieClips have their names in a series the series of mc1, mc2, mc3, etc. We would do that by using i as part of the name this way:

for (var i:Number=0; i<10 , i++){
var my_mc = new MovieClip();
my_mc.name = "mc"+i;

addChild(my_mc);
}
You cannot make use of variables created inside a loop and must use other methods for creating references to objects from inside the loop. You can learn more about this from the last section of this tutorial on variables and loops.

The code above will create ten MovieClips, name them in the series of mc1, mc2, mc3, etc, and add each of them to the display list.

That is basically everything you need to know to start using the for loop. You might want to check our other tutorials to see how it used in actual projects.

The XML Music Player tutorial and the XML Grid Image Gallery make use of the for loop.

The "While" Loop

The while loop has the same exact function as the for loop, but it is written in a different format. Instead of having all the information necessary to run the loop in a single place, the while loop only requires the condition to be provided to the loop itself and leaves the rest for the programmed to supply in the surrounding code.

while (condition){
statements;
}
You might have noticed that the general format of a while loop looks almost identical to an if conditional. An if conditional will be executed only once if the condition is satisfied while the while loop will be executed repeatedly while the condition is satisfied.

In order to use this loop you must create your own counter and then create your own action to invalidate the condition later. The code which we have created earlier can be ported in this loop format this way:

var i:Number = 0;
while (i < 10){
new MovieClip();
i++;
}

You should note that it is much easier to create an infinite loop by mistake using a while conditional as you might forget to provide the action required to increase the value of the counter. You should always use the for loop for your basic usage instead of attempting to use the while loop if your program does not require it specifically.

The "Do While" Loop

A do while loop is very similar to a while loop, the only difference is that a do while will execute the statements once before attempting to check if the condition is satisfied or not. This means that whether or not your condition was satisfied you will always have the statements executed at least once. The general format of this loop is as follows:

do {
statements;
} while (condition);

Again, usage of this loop is required in advanced programs and will not be used in simple beginner applications. The example we had before could be ported into this loop this way:

var i:Number = 0;
do {
new MovieClip();
i++;
} while (i < 10);

For Each In Loop

This loop and the next one are not regular loops and do not serve the same function as those illustrated earlier. The purpose of the for each in loop is not to repeat any general set of code, but to examine an object to retrieve the value of all properties associated with that object. It is written in the generalized format shown below:

for each (var prop in obj){
trace(prop);
}

For example, assume that you have a generic object that has two properties called myName and myAge.

var myObject:Object = new Object();
myObject.myName = "John Doe";
myObject.myAge = 30;

You can use the for each in loop to retrieve the values of these properties easily:

var myObject:Object = new Object();
myObject.myName = "John Doe";
myObject.myAge = 30;

for each (var prop in myObject){
trace(prop);
}
Testing the above code will generate the values "John Doe" and "30" in the output window.

This example might not make a lot of sense because we know the names of our properties and we could have retrieved them manually, but this loop can be helpful when you are working with an object for which you do not know the properties.

For In Loop

The for in loop has a very similar function to the for in each loop, while the previous loop is used to retrieve the values of all the properties of an object, the for in loop is used to retrieve the names of the properties. It is written in the following generalized format:

for (var prop in obj){
trace(prop);
}

If we use the same example above with this loop we will retrieve the names of the properties as opposed to their values:

var myObject:Object = new Object();
myObject.myName = "John Doe";
myObject.myAge = 30;

for (var prop in myObject){
trace(prop);
}
Testing the above code will generate the values "myName" and "myAge" in the output window.

As previously stated, the for each in and for in loop are advanced loops that will be rarely used in beginner and intermediate projects, do not worry about them if you do not fully understand how they work.

Using Variables in Loops

An important thing to learn about loops is that defining a variable inside one makes that variable local, meaning that the variable and its value will disappear after each loop iteration. If a variable was defined inside a loop, you will get an error if you try to retrieve that variable from outside the loop because that variable does not exist outside it.

for (var i:Number = 0; i<10; i++){
var k:Number = i;
}
trace(k);
Testing the code above will generate an error.

If you want to manipulate a variable that you would like to retrieve and access after the loop, you will have to define this variable outside the loop and then simply update its value from within the loop:

var k:Number;
for (var i:Number = 0; i<10; i++){
k = i;
}
trace(k);

However, you should remember that the value of k, or any variable you set directly through a loop will equal that value at the end of the loop and it will not refer to any value previously set. If you are going to create a number of objects from inside a loop, you will need to use advanced referencing techniques or arrays to be able to refer to these individual objects later on.

This concludes our tutorial, I hope that you learned something new from it. Feel free to post any questions or comments you have at the Republic of Code Forum.

- End of Tutorial