ActionScript Programming/PartI/Chapter 3/Arrays

Data types




Arrays are almost the most useful data type of all others. This data type was designed for keeping not one but many values in it. For example you want to have 10 users’ names in variables. So you must declare 10 variables with different names. It will be hard for you do add another user. But using arrays you can just declare one variable and keep all 10 users’ names in it. Now we will learn how to use array and its methods.

 var users:Array = new Array();
 var users:Array = new Array(10);
 var users:Array = new Array("a", "b", "c", "d", "e");

The example above shows you the usage of array. Line 1 just declares an array named “users”. Line 2 declares an array with 10 elements. This means that in that array can be kept 10 values at indexes 0 through 9. The first element in an array is always 0. Line 3 declares an array and sets its’ first 5 elements values. “c” will be the element with the index 2 in this array, because as we have already said the index of the first element in an array is always 0. Now lets write a small program to understand arrays better. Write the code written below to Frame 1 actions.

 1.   var users:Array = new Array(3);
 3.   users[0] = "User 1";
 4.   users[1] = "User 2";
 5.   users[2] = "User 3";
 8.   trace(users[0]);
 9.   trace(users[1]);
 10.  trace(users[2]);

In line 1 we declare array “users” which consists of 3 elements. In lines 3-5 we set “users” each element. If you have an array and you want to get or set any of its element then you must write the name of the array, then “[]” and the number of element inside the quotation marks (“[]”). For example in line 3 we set the first element of “users” to “User 1”. You can use arrays for storing any data in them. For example you have an array which consists only of 2 elements. You can set the first elements value a string (e.g. myArray[0] = “hello”) and the second element a number (e.g. myArray[1] = 5). And finally in the lines 8-11 we trace our “users” array. Now we will create a more complicated example. Follow the steps:

Step 1

Select the Text Tool   from the Toolbox and draw Text. Then select it and in the Properties window set its’ width to 80, height to 25, font size to 20 and change the Text Type to “Static Text”. Type “Number:” in it.

Step 2

Select the Text Tool   from the Toolbox and draw Text. Then select it and in the Properties window set its’ width to 30, height to 25, font size to 20, var to “input”, change the Text Type to “Input Text” and select “Show Border Around Text” button  . Place this Text near the previous Text. This will be our input field.

Step 3

Select the Text Tool   from the Toolbox and draw Text. Then select it and in the Properties window set its’ width to 110, height to 25, font size to 20, var to “output” and change the Text Type to “Dynamic Text”. Place this Text under the two previous labels. The scene must look like this.


Step 4

Set the Fill Color to green and the Stroke Color to black. Then select the Rectangle Tool   in the Toolbox, click the “Round Rectangle Radius” button   in the Options window, set the “Corner Radius” to 5, press OK and draw a rectangle. Double click the rectangle you have drawn and set its width to 35 and height to 25. Select the Text Tool   from the Toolbox and draw Text. Then select it and in the Properties window set its’ width to 25, height to 18, font size to 13, color to red and change the Text Type to “Static Text”. Type “OK” in it and place it in the center of the rectangle. Now select the whole rectangle and this text (by dragging mouse) and convert it to button. In the “Convert to Symbol” dialog set the button’s name to “button” and press OK. Select the button you have created, place it near the Input Text and in the Property window set its name to “btnOK”. The scene must look like this.


Step 5

This is enough for our design. Now open the Frame 1 actions and type the following in the Script Pane:

 1.   var users:Array = new Array(4);
 3.   users[0] = "John";
 4.   users[1] = "Amy";
 5.   users[2] = "Smith";
 6.   users[3] = "Jane";

Then right click “btnOK” and choose “Actions” to view its’ actions. In the Script pane type the following:

 1.   on (release) {
 2.      output = users[input];	
 3.   }

I think you understood everything. The first part of code was nearly the same as in the previous example, and in the second part of code we write a code which must be performed when the user click our “btnOK”. In lines 1 and 3 is written the beginning and the end of “release” event, and in line 2 we write the element of the “users” array which the user has written as “input” is the text which the user has written in the Input Text and “output” is the Dynamic Text in which the element of array is written. The arrays can also be multidimensional. For example you have some users and their phone number and address. For not making 3 different arrays it is easier to create one multidimensional array. The example below shows how to do that.

 1.   var users:Array = new Array(["User1","Phone1","Address1"],
 2.                         ["User2","Phone2","Address2"],	
 3.                         ["User3","Phone3","Address3"]);
 4.   Trace(Name:  + users[0][0]);
 5.   Trace(Phone:  + users[0][1]);
 6.   Trace("Address: " + users[0][2]);
 7.   Trace("Name: " + users[1][0]);
 8.   Trace("Phone: " + users[1][1]);
 9.   Trace("Address: " + users[1][2]);
 10.  Trace("Name: " + users[2][0]);
 11.  Trace("Phone: " + users[2][1]);
 12.  Trace("Address: " + users[2][2]);

In lines 1 to 3 we create a multidimensional array “users”. You can write all these lines in one line. The variable is declared in three lines because it is easier to read. If you combine these lines then the result will be a very long line. Why we don’t put “;” after each line? Because the lines 2 and 3 are the other parts of the main line. So by putting the “;” in the 3-rd line we tell the computer that this was the end. The program will think that this is only one line. Now lets understand how we create a multidimensional array. This is the type of writing multidimensional arrays:

var <array name>:Array = new Array( [ <first array>, <second array>, <…> );

When you write “var myarray = new Array( [], [], [] );” you create an array with 3 subarrays. Imagine something like this:

  • Myarray
    • 0
      • value
    • 1
      • value
    • 2
      • value

If you write “var myarray:Array = new Array ( [ [], [] ], [], [ [] ] );” then this is something like this:

  • myarray
    • 0
      • 0
        • value
      • 1
        • value
    • 1
      • value
    • 2
      • 0
        • value

This is like there is a folder, in which there are three folders. In the first folder there are two folders, in the third folder there is one folder. So if you want to get value from the second folder of the first folder then you must write “myarray[0][1]”. We do the same in our example. If we draw the structure of our array then it will be:

  • users
    • 0
      • 0
        • User1
      • 1
        • Phone1
      • 2
        • Address1
    • 1
      • 0
        • User2
      • 1
        • Phone2
      • 2
        • Address2
    • 2
      • 0
        • User3
      • 1
        • Phone3
      • 2
        • Address3

In this structure you see that the names on folders are only numbers. You can also give them names by writing the following:

 1.   var users:Array = new Array( { name: "U1", phone: "P1", address: "A1"},
 2.                          { name: "U2", phone: "P2", address: "A2"},
 3.                          { name: "U3", phone: "P3", address: "A3"} );
 4.   trace("Name: " + users[0]["name"]);
 5.   trace("Phone: " + users[0]["phone"]);
 6.   trace("Address: " + users[0]["address"]);
 7.   trace("Name: " + users[1]["name"]);
 8.   trace("Phone: " + users[1]["phone"]);
 9.   trace("Address: " + users[1]["address"]);
 10.  trace("Name: " + users[2]["name"]);
 11.  trace("Phone: " + users[2]["phone"]);
 12.  trace("Address: " + users[2]["address"]);

In the previous example we used [ ] for making new arrays. But if you want to give names to arrays you must use { } instead of [ ]. If we were writing values after [] then now we must first write the name of the folder without quotes (“”) then put :  after the name and write the value in the quotes. If you want to add more values then you must put , and do the same. But if you give names to the arrays you must get their value also by using their names. If we make the structure of this example then it will be:

*	Users
**	0
***	name
****	U1
***	phone
****	P1
***	address
****	A1
**	1
***	name
****	U2
***	phone
****	P2
***	address
****	A2
**	2
***	name
****	U3
***	phone
****	P3
***	address
****	A3

==== Properties ====

{| border="2" cellpadding="4" cellspacing="0" style="margin: 1em 1em 1em 0; background: #f9f9f9; border: 1px #aaa solid; border-collapse: collapse; font-size: 95%;"
!Property || Description
|Array.length || returns length of the array

===== Length =====

This property returns the length of the specified array. The following code illustrates the use of property Length:
<syntaxhighlight lang=actionscript>
 1.   var tmpArray:Array = new Array("a", "b", "c");
 2.   trace(tmpArray.length);

The output is 3.

« Previous    Next »