Organizing ActionScript in an Application

One of the most important aspects about programming is consistency, whether it relates to variable naming schemes, coding standards, or where you place your ActionScript code. Code debugging and maintenance is dramatically simplified if the code is organized and adheres to standards. Formatted code that follows an established set of guidelines is easier to maintain, and easier for other developers to understand and modify.

It is important to understand where to put your ActionScript: Should it be in the FLA file, should it be put on the server in an external AS file that you “include”, or should it be a class written using ActionScript 2.0? After you know the scope of your application, you should understand is how to structure your project’s code.

A general guideline for code placement is to put all your code in as few places as possible, whether you put it inside a FLA document or in external files. Organizing your code in one place helps you edit projects more efficiently, because you can avoid searching in different places when you debug or modify the ActionScript. The following sections provide more information about where to put your ActionScript.

Keeping Actions Together

Whenever possible, put your ActionScript in a single location. If you put code in a FLA file, put ActionScript on Frame 1 or Frame 2 in a layer called actions that is on the topmost layer in the Timeline. Alternatively, you might put all of your code in ActionScript (AS) files. Some Flash applications do not always put all your code in a single place (in particular, when you use screens or behaviors).

Despite these rare exceptions, you can usually put all your code in the same location (on a frame, or in AS files). The following are the advantages of this process:

• Code is easy to find in a potentially complex source file.
• Code is easy to debug. One of the most difficult parts of debugging a FLA file is finding all the code. After you find all the code, you must figure out how it interacts with other pieces of code as well as the FLA file. If you put all your code in a single frame, it is much easier to debug because it is centralized, and these problems reduce in number. For information on attaching code to objects (and decentralizing your code), see the next section, “Attaching Code to Objects.”

Attaching Code to Objects

Avoid attaching ActionScript to objects in a FLA file, even in simple SWF files. Attaching code to an object means that you select a movie clip, component, or button instance; open the Actions panel; and add ActionScript using the on() or onClipEvent() handler functions.

This practice is strongly discouraged for the following reasons:

• ActionScript that is attached to objects is difficult to locate, and the FLA files are difficult to edit.
• ActionScript that is attached to objects is difficult to debug.
• ActionScript that is written on the Timeline or in classes is more elegant and easier to build upon.
• ActionScript that is attached to objects encourages poor coding style.
• ActionScript that is attached to objects forces students and readers to learn different coding styles, additional syntax, and a poor and limited coding style. This can be a frustrating experience.

Some Flash users might say it is easier to learn ActionScript by attaching code to an object because it might be easier to add simple code, or write about or teach ActionScript this way. A significant problem exists because most people learning ActionScript need to know how to write the equivalent code, which is not difficult. The contrast between two styles of coding can also be confusing to people learning ActionScript, and requires students to learn two coding styles and forms of syntax, which is why consistency throughout the learning process has advantages.

Attaching ActionScript to a button called myButton_btn looks like the following ActionScript, and should be avoided:

on (release) {
   //do something } 

However, placing ActionScript with the same purpose on the Timeline looks like the following code, which is encouraged:

myButton_btn.onRelease = function() { 
  //do something };