PART 1 - Creating ActionScript 3 Variables and Assigning Values to them - Introduction to Flash AS3 Variables

• PART 1: Creating ActionScript 3 Variables and Assigning Values to them
• PART 2: Variable Naming Rules and Conventions
• PART 3: Fun with Variables - Complete the Story

Welcome to this tutorial series on an Introduction to Flash AS3 Variables. In part 1 of this series, we'll talk about what variables are, see some basic examples, and learn how to create them.

What is a variable?
Think of a variable as a container. It's like a box where you can put something in. But instead of a physical object, a variable can contain information.

A variable is made up of a name and a value. The name is like the label on the box, and the value is the item inside that box.

For example:

quantity = 12

price = 1.25

Here, we have two variables. The first variable has the name quantity, and has a value of 12. And then we have another one with the name price, and a value of 1.25.

We can then use these variables in an equation. For example:

quantity * price

In this equation, the quantity and price are being multiplied. This will give us a value of 15. Since quantity is equal to 12, and price is equal to 1.25, then 12 * 1.25 is equal to 15.

Creating Variables

Step 1

Create a new Flash ActionScript 3.0 document and type in the following lines of code in the Actions Panel:

var quantity:Number;
var price:Number;

In the first two lines, we've declared two variables - quantity and price. To declare a variable, start with the var keyword, followed by the variable name, and then the data type.

The syntax for declaring a variable is as follows:

var variableName:dataType;

What is the data type?
The data type refers to the type of value that a variable can contain. In the two examples, we've specified the Number data type. This means that the variables can only contain numbers. If you try to assign some text as the variable's value, then that will generate an error. Specifying the data type that a variable can contain is referred to as strict data typing or strong data typing.

What are other examples of data types?
Other examples of data types are the String data type and the Boolean data type. String data is made up of characters. The Boolean data type only chooses between 2 values - true or false.

Examples:

var firstName:String;

var isActive:Boolean;

Here, the firstName variable can only contain a String value such as "John" or "Mary" (String values must be enclosed in quotation marks). The isActive variable, on the other hand, can only be assigned a value of either true or false.

In the next step, let's take a look at how to assign values to our variables.

Step 2

To assign values to our variables, add the following lines highlighted in bold:

var quantity:Number;
var price:Number;

quantity = 12;
price = 1.25;

To assign a value to a variable, type the variable name, followed by the equals sign (also known as the assignment operator), and then input the desired value. Here, we have given quantity a value of 12, and price a value of 1.25.

The syntax for assigning a value to a variable is:

variableName = value;

When assigning a value to a variable, there is no need to use the var keyword again since we've already done that at the beginning. The var keyword is used to declare or create the variable. You only need to do that once. You also don't need to declare the data type again.

Step 3

If you want, you can also combine the variable declaration and the value assignment in one statement. Let's do that.

Delete the lines of code that we've already typed and replace them with this:

var quantity:Number = 12;
var price:Number = 1.25;

Here, each variable is declared and assigned a value in one statement. This is pretty much the same thing, except we have fewer lines of code.

Step 4

Next, add some trace statements to verify that Flash is able to access the values assigned to the variables:

var quantity:Number = 12;
var price:Number = 1.25;

trace("The quantity is: " + quantity);
trace("The price is: " + price);
trace("The total is: " + price * quantity);

Here, the trace statements will evaluate the variables and equations, and will display their values. For example, in the first trace statement, the variable name quantity will be displayed as 12, since 12 is the current value assigned to it. In the third trace statement, price * quantity will be calculated, and based on our current values, it will result in a value of 15.

Step 5

Test the movie. You should see the output window display the following lines:

The quantity is: 12

The price is: 1.25

The total is: 15

Step 6

After assigning an initial value to a variable, you may still assign a new value afterward. Let's try that.

After the trace statements, assign new values to the variables:

var quantity:Number = 12;
var price:Number = 1.25;

trace("The quantity is: " + quantity);
trace("The price is: " + price);
trace("The total is: " + price * quantity);

quantity = 5;
price = 2.75;

So now, after the trace statements are executed, the variables will have these new values assigned to them.

Step 7

To check whether the new values have been successfully assigned, let's add another set of trace statements after the lines that assign the new values to the variables:

var quantity:Number = 12;
var price:Number = 1.25;

trace("The quantity is: " + quantity);
trace("The price is: " + price);
trace("The total is: " + price * quantity);

quantity = 5;
price = 2.75;

trace("The values have been changed.");
trace("The new quantity is now: " + quantity);
trace("The new price is now: " + price);
trace("The new total is now: " + price * quantity);

Here, when the first set of trace statements are executed, Flash will be taking a look at the original values. But after that, the variable values have been changed, so the second set of trace statements, which comes after the new values, will now use those new values instead. The FIRST set of trace statements will use the ORIGINAL values, because those trace statements were written BEFORE the values were changed.

Step 8

Test the movie. You should see the output window display the following lines:
The quantity is: 12
The price is: 1.25
The total is: 15
The values have been changed.
The new quantity is now: 5
The new price is now: 2.75
The new total is now: 13.75

Step 9

You can also assign an equation to a variable. For example, we can get the price * quantity equation and store it in a variable like so:

var quantity:Number = 12;
var price:Number = 1.25;
var total:Number = price * quantity;

And then in the trace statements, we can replace all the instances of the price * quantity equation with the total variable instead:

trace("The quantity is: " + quantity);
trace("The price is: " + price);
trace("The total is: " + total);

quantity = 5;
price = 2.75;
total = price * quantity;
// You must compute for the total again in order to
// reflect the new value

trace("The values have been changed.");
trace("The new quantity is now: " + quantity);
trace("The new price is now: " + price);
trace("The new total is now: " + total);

This will give us the same result.

In the next part of this series, we'll take a look at the rules you have to follow when naming variables.

Variable Naming Rules and Conventions - Introduction to Flash AS3 Variables - PART 2: NEXT >>