Actionscript Course

OOP (Object Oriented Programming) is a programming concept (or technique), which treats data and functions as objects.
Important to this concept is to understand the difference between a Class and an Object.

- A class is a "blueprint" for an object, is a code template used to generate objects. It contins the instructions that define the properties and methods that an object can use.

- Objects are elements from the script that are defined to perform the instructions written in a class, and can use the properties and methods defined in the class.
- For example, to understand, you can think of a class as a blueprint for constructing an house. Many houses can be built from the same blueprint, so, the object is the house created according to that blueprint. You can build multiple objects that have the properties defined in the class.

The difference between Class and Object is important. If a class can be asimilated to a type of data, an object can be equated with a variable or with a value having a certain type of data. Practically, a class is a "factory" of objects, that produces objects with the same structure, having the same properties and methods.


• An object is also called a class instance.
• In OOP (Object Oriented Programming) we encounter terms like "Encapsulation" and "Polymorphism".
          - Encapsulation represent the fact that you can use a class (its properties) through an object instance, without having access to its code.
          - Polymorphism is a class ability to do more different things, or use one class or another to achieve the same thing, having similar functions. (For example, you can drink water using a glass, a cup or a bottle. That is Polymorphism).

Defining a class

ActionScript 3 contains several predefined classes, such as "Date class" used when working with date and time, "String class" for strings, and others; but you can also create your own classes.
To create a class use the class keyword, followed by it's name and it's body (contained between curly brackets). The properties and methods are defined in the class body.
          - Properties are variables defined within the class.
          - Methods are functions created within the class.
The general structure of a class is:

class ClassName {
  var property1;
  var property2;
  .................
  function method1() {
    // Funtion code
  }
  function method2() {
    // Function Code
  }
  .................
}

To build a working class that can be used in the Flash document, it is necessary to add other things too.
- First of all, each class must be created inside a Package. The Package is a structure through which multiple classes can be grouped together. This helps to create different classes that can have the same name.
- When you create a class, you can specify special attributes for properties and methods to define their level of access. This attribute is added before the defining word (class, var, const and function), and can be one of the following keywords: - If no attribute is added, it is considered "private".
So, the complete syntax to create a class is:
package packageName {
  attribute class ClassName {
    attribute var property1;
    attribute var property2;
    .................
    attribute function method1() {
      // Function code
    }
    attribute function method2() {
      // Function code
    }
    .................
  }
}
- "packageName" is optional, for beginners it's better to not specify it, because needs extra things (explained below).

• The class is NOT written inside the FLA document, it is created in an external file, with the "as" extension.
From the menu New choose "ActionScript 3.0 Class" or "ActionScript File". Flash opens a small window to add the name of the class, then Flash opens a new a document, where you can write the class code.
In this document, the "package", the class body, and the constructor method are already written. You can delete them or complete them with your code.

Here's an example of a simple class, it contains a property (named "prop"), a method (with the name "metod"), both with "public" attribute, so they can be accessed outside the classe (in a script) and a constant named HIDEN, (with "protected" attribute), so that it can only be used inside the class and it's sub-classes.

TestClas Example

// create the package
package {
  // define the class, with public attribute, a property "prop" and a method "metod"
  public class TestClas
  {
    public var prop:Number = 7;          // Public property
    protected const HIDEN:int = 2;       // "Protected" constant

    // Creating the method, takes an argument (Number type)
    public function metod(val:Number):void
    {
      // changes the value of the "prop" property, with the "val" parameter and the "HIDEN" constant
      this.prop = val + HIDEN;
    }
  }
}
- "this.prop" indicates the property "prop" from this class (the term this is added to indicate that it refers to the property of the current class, avoiding errors that can appear if in that function you use other parameters and variables with the same name).
- After you defined the code of the class, you must save this document with the same name as the class (e.g., "TestClas.as"), from File -> Save, in the same directory in which you have the FLA document which will use this class (if "package" is without a name).

Note, multiple classes can not be created in the same "package" body. This actually represents a folder where the "AS" files with classes that belong to the same group are added. In the "package body" (between it's curly braces) only one class can be created.
          - The question is, how can a "package" contains multiple classes? Package actually represents the path and folder where "AS" files with classes included in that package are saved, each file contains only one class, and all of them form the group inside the package. The folder and the package must have the same name; so the classes that are saved in a directory belong to the "package" with the same name.
- For example, if you want to group two classes (Class1 and Class2) in a package named "group", create a folder "group" (in the same place where the FLA document is saved) and in this folder save the two "AS" files with the code of the classes ("Class1.as", and "Class2.as"). These classes are grouped in the "group" package and can be used in the script with the expression "group.Class1", respectively "group.Class2".
• To use a class or a group of classes from a package, these must be imported in the document, with the syntax:
import packageName.ClassName;
OR:
import packageName.*

- The first formula imports only the "ClassName" class from the "packageName" package, the second formula imports all the classes from that package (folder).
• Classes defined in a simple package (without name) and that are saved in the same directory with the Flash document, it's not necessary for them to be imported.

Using a Class

Once a class is created and saved in a file "ClassName.as", you must create an object instance of that class to can use its properties and methods in a script. This instance must be declared in the script written in the FLA document as any other object used in ActionScript 3 (such as Array, Date, etc., these are also classes), with the sintax:

var name_ins:ClassName = new ClassName();
OR:
var name_ins:packageName.ClassName = new packageName.ClassName();
      (if the class is in a package with a name)
- "name_ins" is the name of the instance (or object) through which the classe's properties and methods can be used.
Here's an example how the "TestClas" presented above can be used.

Copy the code from "TestClas example" in a document "ActionScript 3.0 Class" and save it with the name "TestClas.as" in the same folder as the FLA document which will use this class. In the Flash document add the following AS3 code:
// Creates the object instance of the TestClas class
var tst:TestClas = new TestClas();

// Checks the value of the "prop" property 
trace(tst.prop);            // 7

// access the "metod()" method, which change the value of "prop"
tst.metod(18);

// checks "prop"
trace(tst.prop);            // 20
- Because the FLA file and the TestClas class are in the same folder, Flash automatically imports this Class when an instance is created. When you access the properties and methods (through the instance), the instructions asociated to them in that class are executed in the script.
- The constant "HIDEN" having the attribute "protected", can be used only in the class code (or it's sub-classes), if you try to access it outside the class (e.g., trace(tst.HIDEN)), an error will be returned.

The constructor

The constructor is a special function inside the class. It must have the same name as the class. This method is always "public" even if this attribute is not mentioned.
The constructor is automatically called when an instance of the respective class is created.
Another difference from other functions is that the Constructor not use the "return" instruction.


Here's a new version of the "TestClas" class, that includes the contructor method.
// create the package 
package {
  // define the class, with public attribute
  public class TestClas
  {
    public var prop:Number = 7;          // Public property
    protected const HIDEN:int = 2;       // "protected" constant

    // Creating the constructor
    public function TestClas(nr1:Number, nr2:Number)
    {
      // stores in a variable the arithmetic average of the "nr1" and "nr2" parameters
      var average_a = (nr1+nr2)/2;
      trace(average_a);          // Returns in output the "average_a" value
    }

    // Create method (takes a Number type argument)
    public function metod(val:Number):void
    {
      // change the value of the "prop" property, a number given by the "val" parameter and the "HIDEN" constant
      this.prop = val + HIDEN;
    }
  }
}
- Notice that the contructor method has the same name as the class. The constructor is defined with two parameters ("nr1" and "nr2"), when an instance of this class is created, two values must be added as arguments (new TextClass(val1, val2)).
Save this class and write the following code in the Actions panel:
var tst:TestClas = new TestClas(7, 8);
- In the Output panel will be displayed the number 7.5, fact that demonstrates that the Constructor method is called automatically and its code is executed when an object instance is created.

The Accessor method

The variables (or properties) created in a class can be defined with a value or they can simply be declared without value. Then you can create a function to change or assign their value. This function is generically called Accessor method, it's the same as any other method, only that it's purpose is to attribue values to properties.
To see how the "accessor method" works, try the following example, in which a class "testclas2" is created with two properties (without value), and an accessor function that assigns value to these properties.
- Open a new document with "ActionScript 3.0 Class", give it the name "testClas2". Delete the initial code and copy the following code, then save the file, with the name "testClas2.as", in the same folder as the FLA document is.

package {
  // define the class
  public class testClas2 {
    // Defining properties without value
    public var prop1:Number;
    public var prop2:String;

    // Create accessor method
    public function setProp(prop1:Number, prop2:String)
    {
      // Assign values to the properties (the ones with "this")
      this.prop1 = prop1;
      this.prop2 = prop2;
    }
  }
}
- The function's parameters (in this case "setClas(prop1, prop2)") can have any name, but setting their name as the properties they represent helps you later to know their role and easier to understand the code.
- The "this" instruction specifies exactly which the property is, and makes the difference between property and parameter with the same name.

in the ActionScript panel from the Flash document (saved in the same folder as "testClas2") add the following code:
// Create object instance of the testClas2 class
var obj4:testClas2 = new testClas2();
// Verify in Output 'prop1' and 'prop2'
trace(obj4.prop1+"-"+obj4.prop2);          // NaN-null

// Call the accessor method
obj4.setProp(8, 'Tutorials');

// Verify 'prop1' and 'prop2' again
trace(obj4.prop1+"-"+obj4.prop2);          // 8-Tutorials
- "NaN" is returned by a Number type variable without value, "null" by a String type variable without value.
- After calling the method "obj4.setProp(8, 'Tutorials');", "prop1" and "prop2" receive the arguments value, 8 and 'Tutorials'.

This method is usefull when you want the properties value to be dinamically defined in the script.


- The FLA and AS files with the examples from this lesson can be downloaded from: OOP - Classes and objects - Create Class.

Daily Test with Code Example

HTML
CSS
JavaScript
PHP-MySQL
Which tag is used to include external CSS file in web page?
<body> <script> <link>
<link href="/templ/style.css" rel="stylesheet" type="text/css" />
Which CSS property sets the text size?
font-weight text-decoration font-size
h2 {
  font-size: 1em;
}
Indicate the JavaScript property that can add HTML code into an element.
text value innerHTML
document.getElementById("someID").innerHTML = "HTML content";
Click on the function that returns the number of characters of a string in PHP.
count() strlen() stristr()
$str = "http://CoursesWeb.net/";
$nr_chr = strlen($str);
echo $nr_chr;       // 22
OOP - Classes and objects - Create Class

Last accessed pages

  1. Change CSS file with jQuery (5373)
  2. Complex Shapes with a single DIV and CSS (3692)
  3. Brush and Eraser (3274)
  4. jqPlot Charts (6206)
  5. Keep data in form fields after submitting the form (12353)

Popular pages this month

  1. Courses Web: PHP-MySQL JavaScript Node.js Ajax HTML CSS (334)
  2. Read Excel file data in PHP - PhpExcelReader (128)
  3. The Four Agreements (98)
  4. PHP Unzipper - Extract Zip, Rar Archives (96)
  5. The Mastery of Love (90)