Object-Oriented programming (OOP) is a specific programming technique to create chunks of programming code (called "objects") that do a specific job, and divide the script into distinct pieces that can be easily managed. These pieces of code can be grouped to form another object.
- For example, the wheels, frame, the pedal, and the handlebars of a bike are separate objects, but if you unite them, they can form a bicycle, which also can be considered an object.
The same is in ActionScript programming, the text, line, shape, movie clip symbol, functions, etc., anything is considered an object.

• Objects are defined using two primary identifiers (or members): properties and methods.
In programming, "method()" is a function defined in the code of a class, so it uses round brackets.
- Becouse the method is basically a function, it can have one or more parameters (separated by comma) within brackets.
                method(parameter1, parameter2)
The dot operator (.) is used to access the members of an objects (properties and methods).
Each code line should end with a semicolon (;)
                E.g.      object.property.method();

The characteristics of an object can be changed through its properties and methods.
To assign or change the value of a property, use the following syntax:
object.property = value;
  - Example:
// square is the object, width is the property, and 100 is the value
square.width = 100;

There are methods that can be called to define a property of an object, with the syntax:
  - Example:
// the beginFill() method defines the graphics property of the object "square"
And methods that can be applied directly to the object:
  - Example:
// gotoAndStop(9) method moves the curent Frame in myClip animation to Frame 9, and stop

• In addition to objects, properties and methods, in OOP there are elements known as "events".
So, the following elements are used in OOP (Object Oriented Programming):
To understand how these elements work, try the following example.
- We create a Flash presentation that changes the size and position of a square when we click a button.
Notice how the OOP elements are used: object, property, event, and how to make the connection between objects on the Stage and ActionScript code.
  1. Open a new Flash document (ActionScript 3.0), select the "Rectangle tool" and draw a square on the stage.
  2. Convert the square into Movie Clip symbol (from Modify -> Convert to Symbol, and select "Movie Clip" Type).
    - The square on the Stage becomes an instance of the Movie Clip symbol.

    Before you can control objects on the Flash stage with ActionScript, you have to convert them to movie clip or button symbols.

  3. With the square selected, open the "Properties panel" and give this instance the name square
    - The name of an Instance on the Stage is added in the "Properties panel", in the field where you see: "<Instance Name>".

    This step is important. If you give objects on the stage a name, you can use their name in the script code to tell ActionScript exactly which object you're talking about. The name of an instance on the stage will represent that object in the script code.

  4. Select the "Oval tool" and draw a circle near the square (as shown in the imge below), then convert this circle into Button symbol (from Modify -> Convert to Symbol, and select "Button" Type).
    Make sure the circle on the stage is selected, and then in the "Properties panel" type buton in the "Instance Name" box, as shown in the picture below.
    Objects on Stage and Instance name
  5. Create a new layer in the Timeline (from Insert -> Timeline -> Layer), double-click the layer name, and then type "actions".

    It's good programming practice to create a separate layer in the Timeline for your ActionScript code. Naming it "actions" or "scripts" makes it clear that the layer is reserved for code.

  6. Right-click on Frame 1 in "actions" layer and choose Actions.
  7. In the "Actions panel" add the following code:
    // registers an event listener for "buton" object
    buton.addEventListener(MouseEvent.CLICK, setWidth);
    // defines the function accessed by the event
    function setWidth(evt)
      // set the width and Y position for "square" instance
      square.width = 115;
      square.y = 100;
  8. Press "Ctrl+Enter" to see the result.
    The Flash Player will display a presentation like this (click on the yellow circle, which is the button):
The FLA file with this example can be downloaded from: Understanding OOP.

- "addEventListener()" is an ActionScript method used to "registers an event listener". The first parameter is the event the listener is listening ("MouseEvent.CLICK"). The second parameter is the name of the function ("setWidth") that run when the event happens.
- "setWidth()" executes the code added within its curly brackets {} when it is accessed.

Daily Test with Code Example

Which tag is used in <table> to create table header cell?
<thead> <th> <td>
  <th>Title 1</th>
  <th>Title 2</th>
Which CSS property sets the distance between lines?
line-height word-spacing margin
.some_class {
  line-height: 150%;
Which function opens a new browser window.
alert() confirm() open()
document.getElementById("id_button").onclick = function(){
Indicate the PHP function that returns an array with names of the files and folders inside a directory.
mkdir() scandir() readdir()
$ar_dir = scandir("dir_name");
Understanding OOP - Object Oriented Programming

Last accessed pages

  1. Add, Change, and Remove Attributes with jQuery (35900)
  2. CSS Rhombus Shape (3817)
  3. Working with getElementById (11165)
  4. JavaScript Course - Free lessons (14717)
  5. JavaScript Tutorials (945)

Popular pages this month

  1. Read Excel file data in PHP - PhpExcelReader (445)
  2. Register and show online users and visitors (399)
  3. PhpSpreadsheet - Read, Write Excel and LibreOffice Calc files (386)
  4. Courses Web: PHP-MySQL JavaScript Ajax HTML CSS Flash-AS3 (302)
  5. Insert, Select and Update NULL value in MySQL (296)