We've covered a lot of material in this chapter. For review and reference, here's a quick-and-dirty overview of OOP techniques in ActionScript. At the end, you'll find a template for creating a new OOP application.
To create a class:
function ClassName (param1, param2) { // ...constructor code goes here... }
To create instance properties for a class:
function ClassName (param1, param2) { // Instance properties this.propName1 = param1; this.propName2 = param2; }
Best practice is to create all properties used in a class's methods in the class constructor, even if the properties initially have no value:
function ClassName (param1, param2) { // Declare all instance properties this.propName1 = param1; this.propName2 = param2; this.propName3 = null; // Used by method1( ); this.propName4 = null; // Used by method2( ); }
After creating properties, initialize the object:
function ClassName (param1, param2) { // Declare all instance properties this.propName1 = param1; this.propName2 = param2; // Initialize object. // ...initialization code goes here... }
Instead of putting the initialization code in the constructor, consider using an init( ) method, which can be called to reset the object to its default state:
function ClassName (param1, param2) { // Declare all instance properties this.propName1 = null; this.propName2 = null; // Initialize object this.init.apply(this, arguments); } ClassName.prototype.init = function (param1, param2) { this.prop1 = param1; this.prop2 = param2; };
To create an instance method:
ClassName.prototype.methodName = function ( ) { // ...method body goes here... };
To refer to an instance within a method of the instance, use the this keyword:
ClassName.prototype.methodName = function ( ) { this.propName1 = value; this.doSomething( ); };
To create a static property, attach it to the class constructor function:
ClassName.staticPropName = value;
To create a static method, attach it to the class constructor function:
ClassName.staticMethodName = function ( ) { // ...method body goes here... };
To create a subclass, set the prototype property of the class constructor function:
function SubClassName (param1, param2) { // ...constructor code goes here... } // DO THIS BEFORE DEFINING SubClassName's METHODS! SubClassName.prototype = new SuperClassName( );
We've covered a lot of conceptual ground, so let's synthesize some of these ideas to help you put OOP into practice.
Define everything in a class. All variables and functions should be properties and methods of a class. This ensures that properties and methods are grouped logically and are always qualified by some object (which helps avoid scope problems).
For the sake of organization and reuse across projects, store each class in a single, separate .as text file.
Define all classes on _global.
Use simulated namespaces. Create an object on _global that will hold all your classes, as shown in Section 12.9.2.
Create a single main( ) function that starts your application rolling.
Create all instance methods on your constructor's prototype object, not in the constructor.
Always document your classes, properties, and methods. For an example, see Section 12.9.2. In your documentation, specify which methods and properties are intended for public use and which are intended for private, internal use by the class.
Sometimes ActionScript is so flexible that it becomes slippery. There are so many ways to create a legal object-oriented application that finding a standard approach can become an arduous task. The following sample template for an object-oriented application attempts to provide some initial direction. You should adapt it to your needs. An electronic version of the template is available at the online Code Depot.
The following code should be attached to the main timeline of yourApp.fla, where yourApp.fla is your application's main Flash source file. The frame to which you attach the code should be preloaded (see MovieClip._framesloaded in the ActionScript Language Reference for preloading information).
// = = = = = = = = = = = = = = = = = = = = = = = // LOAD CLASSES // = = = = = = = = = = = = = = = = = = = = = = = // Create namespace in which to store classes if (_global.com = = undefined) { _global.com = new Object( ); } if (_global.com.yourDomain = = undefined) { _global.com.yourDomain = new Object( ); } // Load external .as files, one per class #include "YourClass.as" #include "YourSubClass.as" // = = = = = = = = = = = = = = = = = = = = = = = = // START APPLICATION // = = = = = = = = = = = = = = = = = = = = = = = = main( ); // Function: main( ) // Desc: The single entry point for your application function main ( ) { // Create and use instances of your classes var yourInstance = new com.yourDomain.YourClass(arg1, arg2); var yourSubInstance = new com.yourDomain.YourSubClass(arg1, arg2, arg3, arg4); yourInstance.yourMethod( ); yourSubInstance.yourSubMethod( ); yourSubInstance.yourMethod( ); }
The following code should be saved in a file named YourClass.as. In this example, YourClass.as and yourApp.fla reside in the same directory.
/* * YourClass Class * Version: 1.0.0 * Desc: Your description goes here. * * Constructor Params: * param1 -Short description * param2 -Short description * * Methods: * yourMethod( ) -Short description * * Static Properties * staticProp1 -Short description * staticProp2 -Short description * * Static Methods * staticMeth( ) -Short description */ /* * Class Constructor */ _global.com.yourDomain.YourClass = function (param1, param2) { // Create instance properties this.prop1 = param1; // Short description. Type: state datatype this.prop2 = param2; // Short description. Type: state datatype this.prop3 = null; // Short description. Type: state datatype // Initialize object // ...initialization code goes here... // Consider packaging init code into an init( ) method }; /* * Static Properties */ com.yourDomain.YourClass.staticProp1 = value; com.yourDomain.YourClass.staticProp2 = value; /* * Static Methods */ com.yourDomain.YourClass.staticMeth = function ( ) { }; /* * Instance Methods */ /* * Method: YourClass.yourMethod( ) * Desc: Short description. * * Params: * param1 -Short description */ com.yourDomain.YourClass.prototype.yourMethod = function (param1) { // Method body... trace("yourMethod invoked"); };
The following code should be saved in a file named YourSubClass.as. In this example, YourSubClass.as and yourApp.fla reside in the same directory.
/* * YourSubClass Class. Extends YourClass. * Version: 1.0.0 * Desc: Your description goes here. * * Constructor Params: * param1 -Superclass parameter * param2 -Superclass parameter * param3 -Short description * param4 -Short description * * Methods: * yourSubMethod( ) -Short description */ /* * Class Constructor */ _global.com.yourDomain.YourSubClass = function (param1, param2, param3, param4) { // Invoke superclass constructor. super(param1, param2); // Create instance properties. this.subProp1 = param3; // Short description. Type: state datatype this.subProp2 = param4; // Short description. Type: state datatype this.subProp3 = null; // Short description. Type: state datatype // Initialize object. // ...initialization code goes here... // Consider packaging init code into an init( ) method }; /* * Establish Inheritance. MUST COME BEFORE METHODS! */ com.yourDomain.YourSubClass.prototype = new com.yourDomain.YourClass( ); /* * Instance Methods */ /* * Method: YourSubClass.yourSubMethod( ) * Desc: Short description. * * Params: * param1 -Short description */ com.yourDomain.YourSubClass.prototype.yourSubMethod = function (param1) { // Method body... trace("yourSubMethod invoked"); };