About Pi Downloads Documentation Plugins Developer Forum Issues

Object Oriented Programming with pi.js2009-01-06 09:23:30

Summary

When creating classes with Javascript, various difficulties appear. Pi provides a modern technique which solves these issues.
Pi's added extend method for the Function native class, leads to creating classes that are extending other classes. To create a new class, pi.base object can be extended.
var product = pi.base.extend({
	"$Init":function(_name){
		this.env.setName(_name);
		return this;
	},
	"buy":function(){ 
		confirm("It's {0}, do you want to buy?".format( this.env.getPrice() ));
	},
	"env":{
		"_price":"$0", "_name":"", "_color":"",
		"setPrice":function(_value){
			this._setPrice("$"+_value);
			return this._parent_;
		}
	}
});
As seen by the example, we send a prototype object to the extend function and we get a Javascript class as response. Also, to define a constructor, we have created a function called $Init.

Using Objects And Arrays as Members

We can restrain variables in object and array formats for classes that are created by pi.base. These type of variables will be automatically cloned. If you do not want cloning, send true value as second parameter. Alsin, add a value called _parent_ to hash members. This way, it is possible to reach one higher level object.

Private Members

To define a private member, use underscore. Pi, creates the get-set accessors for private member automatically. Let's try the examples accessors of the products objects;
>>> var bicycle = new product("bmx");
>>> bicycle.env.getName()
"bmx"
>>> bicycle.env.setName("bianchi")
>>> bicycle.env.getName()
"bianci"
Sometimes you need to create a custom get/set accessor. Pi will create the accessor functions with a udnerscore as prefix.Please inspect the setPrice function of the example above. Now, lets try this function;
>>> var bicycle = new product("bmx");
>>> bicycle.env.setPrice(200);
>>> bicycle.env.getPrice();
"200$"
>>> bicycle.env._setPrice(200);
>>> bicycle.env.getPrice();
200

Chaining

Classes that are created by pi are prepared for chained value definition, the automatically created get/set accessors returns the parent object. For example,
>>> var bicycle = new product("bmx").env.setPrice(20).env.setColor("blue");
>>> bicycle.getColor()
"blue"

Extending

var person = pi.base.extend({ 
	"$Constructor":function(a,s,l){ 
		this.age = a; 
		this.gender = s; 
		this.location = location; 
	}, 
	age:0, gender:"", location:"" 
});

var member = person.extend({ 
	"$Constructor":function(a,s,l,email,password){
		this.email=email;
		this.password=password;
		person["$Constructor"].call(this,a,s,l);
	},
	"email":"", 
	"name":"", 
	"password":""
});
First we have created a class named human and after that a class named member which includes human class.For processing the values that we get from the person class, we have used the function person at the and of the constructor.Now let's try new classes;
>>> var selo = new human(50,'male','istanbul'); 
>>> selo.age; 
50
>>> var devrim = new member(30,'female','istanbul','foo@kodfabrik.com','12345'); 
>>> devrim.age;
30
>>> devrim.email;
'foo@kodfabrik.com' 

See Also