Object Oriented Programming

...in which Andy describes the basics of Object Orientated programming with examples in PHP and Javascript

Lesson 1: Classes, Instances, Methods and Properties

Object oriented programming is a useful tool in the vast toolchest available to a programmer. It allows for more code re-use, and can make complex programs easier to understand and debug. However, it can also lead to more complex probrams if used incorrectly.

Anyway, enough waffle, let's dive straight in with an example to cover the basics. We will start with a PHP object which will write an HTML <select> tag for us. We're aiming for an easy way to write a <select> tag, which will simplify the way of choosing the item which is selected by default.

class DropDownBox {
	// TODO: Some method to create $this->list
	
    function writeOption( $option, $value ) {
        echo "<option value=\"" . $value . "\"";
        if ( $this->value == $value ) {
            echo " selected ";
        }
        echo ">" . $option . "</option>";
    }
    
    function render() {
        echo "<select>";

        foreach ($this->list as $key=>$val) {
            $this->writeOption( $val, $key);
        }
        echo "</select>";
	}
}

The code above shows part of the object definition for a DropDownBox. An object is a representation inside the computer of a real world thing. The code listed above doesn't, in itself, draw a <select> tag for us: but it does define a mechanism which we can use to write lots of different <select> tags.

The code above is called the Class Definition. It defines a class of a thing, in this case a class of thing called a DropDownBox. Every time you want a DropDownBox, you ask for a new one of these, which you can then use.

When you've asked for one of these "things", you have an Instance of that thing (that class). It's important to go over the terminology, as we'll use it a lot later.

I'll show you how to create an instance of the DropDownBox in a moment. First, re-read the code above. There are two functions inside the class definition, one called writeOption() and one called render(). When a function is defined inside a class like this, it's called a Method. In the object shown above, the method "render()" will generate some output, and the method "writeOption()" will write a single <option> tag, with knowledge about how to display the selected option

As you read the code, you'll see that some things are missing. For example $this->list and $this->value are not defined anywhere. (I'll add them in a moment; they're only missing because I wanted to keep the first code snippet short) These things would be variables in a procedural programming environment, and inside a class, we call them Properties because they are properties of the object. Note that they are attached to the class definition using the special variable $this. Each time we create an instance of our object, the $this variable is a reference to that particular instance of the object.

To create an instance of this class, and use it straight away, we might write some code like this (note, I've used some methods which I'm going to define later, so the code makes sense.)

	$box = new DropDownBox();
	
	// call some method we haven't 
	// talked about yet, to populate
	// the Drop Down Box instance.
	$box->setValues( array(
	                 "en"=>"English", 
	                 "fr"=>"French", 
	                 "de"=>"German" )); 
	
	// set the selected value.              
	$box->setValue("fr");
	
	// draw our Drop Down Box
	$box->render(); 

which would give us something like this:

English French German

I promised above that I'd provide all the code for this class. Here goes...
The DropDownBox class has the following methods:

• setValues ($list) - used to list the possible options
• setValue ($value) - used to specify which item in the list is shown when the page first loads
• render() - used to draw the HTML to the page.
• writeOption( $option, $value) - a method used within the class to write a single option

class DropDownBox {

    /*
    * writes a single option, making it selected 
    * if necessary.
    */
    function writeOption( $option, $value ) {
        echo "<option value=\"" . $value . "\"";
        if ( $this->value == $value ) {
            echo " selected ";
        }
        echo ">" . $option . "</option>";
    }
    
    /*
    * Renders the whole Select tag with options.
    */
    function render() {
        echo "<select>";

        foreach ($this->list as $key=>$val) {
            $this->writeOption( $val, $key);
        }
        echo "</select>";
    }
	
    /*
    * Sets up the list of options to be drawn. e.g.
    * $d->setValues ( array("en"=> "English", 
    *    "fr" => "French", "es" => "Spanish"));
    */
    function setValues($list) {
        $this->list = $list;
    }
	
    /*
    * Sets the value which is selected by default.
    */
    function setValue($v) {
        $this->value = $v;
    }
}

That's enough for today. In the next lesson, we'll look at Constructors, Destructors and Encapsulation.

§