Building a Dump Class

< Day Day Up >

At this point, Macromedia Flash MX 2004 does not have a simple way to display complex data structures to the developer in ActionScript itself, especially if we build our application like the call center application, using custom classes. If we return an Array of Objects or an Array embedded within an Object or any complex data structures, it can be very difficult to ascertain what is inside by simply using trace statements within our code.

We are going to build a class that will "dump" out any complex data structure that we pass to it. Whether we have an Array of Objects, an Object with Arrays inside, or an Object with Objects inside, the Dump class will display the contents to the developer.

The Dump class will focus on dealing with complex hierarchical data structures that would likely be returned from Web Services, Flash Remoting, Extensible Markup Language (XML), or other server-side solutions. Examples of these data structures include arrays, Objects within arrays, arrays within Objects, and so on.

Building and Structuring the Dump Class

In this section, we build a custom Dump class that will display complex data structures to the developer, to facilitate debugging of the application. First we will define the class, then interrogate the data structure that is passed to it and apply the appropriate ActionScript to display the structure to the developer. Finally, we will utilize the programming principle of recursion in case an Object is within an Object or an Array is within an Array, to produce clear, concise code.

To build the Dump class, define the Dump class and the constructor in an ActionScript (AS) file with the name of Dump :
```
 class Dump {     function Dump() {} } 
```
The class will contain one static method, dumpThis . This method will be static because this class is a debugging tool and there is no reason to waste client resources with the instantiation of another Object each time we want to display the contents of a data structure. It also requires less code for the developer. If we define dumpThis as a static method, we can call it simply by referencing the name of the class:
```
 Dump.dumpThis(); 
```
The dumpThis method will take any data structure passed to it and display the contents to the developer. The dumpThis method will interpret the data passed to itfor example, decide whether the data structure is an Object or an Array. The class will then loop over an Object, Array, or whatever data structure we pass to it and display the contents to the developer.

We will write the dumpThis method so that it is able to accept any data structurefor example, an Array of Objects, an Array of Arrays, an Object of Arrays, and so on. Add the static method dumpThis to your Dump class so the code appears as shown here:
```
 class Dump {     function Dump() {} static  function dumpThis () { }} 
```
Build the dumpThis method. We will need to interrogate the data structure that the developer has passed to the Dump class. To do this we will use the instanceof operator. The instanceof operator programmatically determines the class that an Object we are passing in belongs to:
```
 function dumpThis (theObject :Object) { if (theObject instanceof Array) {     trace ("Array:"); } 
```
If theObject is an instance of the Array class, the if statement will return true . Remember that every class in ActionScript descends from the Object class so we can pass in the parameter as an Object. As we know, all Objects in Flash inherit from the Object class. However, we can still use Object as a condition and instanceof will only return true if the Object passed in actually belongs to the Object class and does not just inherit from it. This is perfect for our dumpThis method because we need to determine if the Object is an instance of the Array class or the Object class so we can call the appropriate looping convention, either a for loop to loop through an Array or a for-in loop to loop through an Object.
Add the following ActionScript so that the dumpThis method will accept an Object as a parameter. Remember that all functions in ActionScript 2.0 should be typed. This function will not actually return anything, so be sure to type the function as Void . Instead of returning the output, we will utilize the trace function within the method. Your dumpThis method should now look like this:
```
 static function dumpThis (theObject:Object):Void {} 
```
Remember that all classes inherit from the Object class so if we type the parameter itself to an Object, we can pass in any class, including an Array. Function parameters do not differentiate like instanceof does.
Add the conditional logic that will test to see if the Object passed in is an instance of the Array class. Add the code to the method and ensure that your dumpThis method looks like this:
```
 Static function dumpThis (theObject:Object):Void {         if (theObject instanceof Array) {             //code to loop through an Array     } } 
```

Add the conditional logic that will test to see if the Object passed in is an instance of the Object class. Add the following code to the dumpThis method and be sure the complete dumpThis method looks as shown:

 static function dumpThis (theObject:Object):Void {         if (theObject instanceof Array) {             //code to loop through an Array     }                else if (theObject instanceof Object) {                    //code to loop through an Object } }

The trace function will trace out movie clips, strings, loadVars Objects, and XML Objects as well as other data types. Let's use the trace function to trace the passed data structure if it is neither an Array or an Object and the following else statement to the dumpThis method using the else operator:

 static function dumpThis (theObject:Object):Void {         if (theObject instanceof Array) {             //code to loop through an Array             }                else if (theObject instanceof Object) {                    //code to loop through an Object                }                else {                 trace (theObject);                } }

Write the ActionScript that will actually dump out the contents of an Array passed in. The easiest way to loop through an Array is to use a for-in loop. We are going to loop through the Array that is passed to the dumpThis method by creating a variable that is equal to the length of the Array and then using that variable as the iterant for the loop. We can use methods and properties of the Array class because we have already used conditional logic to determine that the Object passed in is in fact an instance of the Array class.

It is a good idea to utilize recursion here and call dumpThis again in case it encounters another instance of the Array or Object class. If this happens, it will simply call the dumpThis method again and dump out the Object or Array it encounters. By utilizing recursion, we can handle any complex data structure that the developer will pass to the method, and all we have to do is call the dumpThis method again.

N OTE

Generally, the use of recursion can lead to slower execution of ActionScript but, in this case, it doesn't matter too much since we will only be using the Dump class for debugging.

Add the following ActionScript, which dumps out the contents of an Array to the dumpThis method within the conditional logic that tests for an Array:

 class Dump {     function Dump() {}         static function dumpThis (theObject:Object):Void {             if (theObject instanceof Array){                 trace ("Array:");                 var len = theObject.length;                 for (var i=0;i<len;i++) {                 trace ("[" + i + "]");                 dumpThis(theObject[i]);             }             }             else if (theObject instanceof Object) {                 //code to loop through Object                 }                        else {                                trace (theObject);                }         } }

Write the ActionScript that will dump out the contents of an Object if an Object is passed in to the dumpThis method. The easiest way to loop through all of the properties of an Object is to use a for-in loop. The for-in loop lets us loop over all the properties of any Object. The syntax is as follows :
```
 for (var prop in Object) { trace (prop) } 
```
This ActionScript returns the names of all the properties in the Object. We cannot access a property value using dot notation if the property name is dynamic. To access the value of named properties inside the loop, we need to use the bracket notation, which evaluates the value of the property name.

If the Object that is passed in to dumpThis is in fact an instance of the Object class, we need to recursively call the dumpObject method, and we will use an else if conditional statement to test. If the parameter is in instance of the Object class, we will call the dumpThis method again, and if not we will simply trace the contents of the property. Add the following code to ensure that the dumpThis method looks as shown here:
```
 class Dump {      function Dump() {};         static function dumpThis (theObject:Object):Void {             if (theObject instanceof Array){                 trace ("Array:");                 var len = theObject.length;                 for (var i=0;i<len;i++) {                 trace ("[" + i + "]");                 dumpThis(theObject[i]);             }             }             else if (theObject instanceof Object) {                 //code to loop through Object                 trace ("Object:");                 for (var prop in theObject){                     if (theObject[prop] instanceof Object) {                         dumpThis(theObject[prop]);                     }else {                         trace (prop+"."+theObject[prop]);                     }                 }             } else {                 trace (theObject);             }         } } 
```

There is one other type of data structure we need to account for in the dumpThis method, and that is an associative Array. An associative Array is in fact an instance of the Array class but acts just like an Object as shown here:

 var myPublishers = new Array(); myPublishers["publisher1"] = "Pearson"; myPublishers["publisher2"] = "MM Press"; myPublishers["publisher3"] = "New Riders";

Associative Arrays have no numerical iterant, and it is not possible to use Array methods or properties on them. This means that our dumpThis method will not be able to handle an associative Array because it will attempt to use a for-in loop to loop through an associative Array as shown here, and this will not work because the associative Array does not have an iterant:

 static function dumpThis (theObject:Object):Void {              if (theObject instanceof Array){                  trace ("Array:");                  var len = theObject.length;                  for (var i=0;i<len;i++) {                  trace ("[" + i + "]");                  dumpThis(theObject[i]);              }              }

In order to loop through an associative Array, we need to use a for-in loop. However, in our dumpThis method, we need to test and see if the Array has an iterant. To do this we can use the following conditional logic after we have confirmed that theObject passed in is in fact an instance of the Array class:

 if (theObject instanceof Array){ if (theObject[0] != null){       //code to loop through Array } }

If this returns true, we know we are dealing with a regular Array and can perform the usual for-in loop. However, if theObject[0] is in fact null , this means we are dealing with an associative Array and we must use a for-in loop. Add the code to the Dump class and be sure the final Dump class appears as shown here:

 class Dump {      function Dump() {};         static function dumpThis (theObject:Object):Void {             if (theObject instanceof Array){                 if (theObject[0] != null) {                 trace ("Array:");                 var len = theObject.length;                 for (var i=0;i<len;i++) {                 trace ("[" + i + "]");                 dumpThis(theObject[i]);                 }             }else{                 trace("Associative Array:");                 for (var j in theObject) {                         trace (j+"."+theObject[j]);                     }             }             }             else if (theObject instanceof Object) {                 //code to loop through Object                 trace ("Object:");                 for (var prop in theObject){                     if (theObject[prop] instanceof Object) {                         dumpThis(theObject[prop]);                     }else {                         trace (prop+"."+theObject[prop]);                     }                 }             } else {                 trace (theObject);             }         } }

The Final Dump Class

We can now view debug complex data structures using the Dump class that we built. This class will allow us to see the data coming back from Remoting, or a web service, or an Array that we build in XML. Once we understand how the data is structured, we can see how it can be utilized in ActionScript 2.0.

Create an Array and display the contents to the user . We will use all types of data structures in the Array to ensure that our Dump class works properly. We will use an Array of Objects, a simple string, and an associative Array. Add the following code to build a simple Array of Objects:

 var newsWeek :Object = new Object(); newsWeek.idNo =  1; newsWeek.productName = "Newsweek"; newsWeek.productType = "News"; newsWeek.productDescription = "American's source for current events and the latest in what's happening"; var time :Object = new Object(); time.idNo =  2; time.productName = "Time"; time.productType = "News"; time.productDescription = "Simply the best on in-depth analysis of today's current events"; var myPublishers = new Array(); myPublishers["publisher1"] = "vPearson"; myPublishers["publisher2"] = "MM Press"; myPublishers["publisher3"] = "New Riders"; var magArray :Array = new Array; magArray[0] = newsWeek; magArray[1] = time; magArray[2] = "PC World"; magArray[3] = myPublishers;

In order to call the Dump class, we simply have to reference the name of the class and the dumpThis method. We can pass any type of complex data structure to the dumpThis method. Add the following code after the magArray has been created.
```
 Dump.dumpThis (magArray); 
```
This will display a detailed description of the data structure that was passed to the dumpThis Object method. Figure 17.8 shows the results of this code being added.

Figure 17.8. Viewing an Array of Objects with the Dump class.

< Day Day Up >

Building a Dump Class