Object Oriented Javascript

Hi People,

because many people ask, i am going to introduce you object oriented javascript. Object Oriented programming is actually the way you think about your application espacially the architecture. All frameworks use object oriented way (except some Java frameworks those use Aspect oriented programming, i will talk about it later.) but why? There are many benefits of object oriented programming but one of the reasons is more important and significant than others in total. Object oriented way of programming allows you write robust scalable applications, with other words if you use object oriented way, no matter how complicated is your application, your code will be clear. This is same for the javascript. In fact javascript's object oriented capabilities are more abstract than some server-side languages like PHP or ASP. PHP has always the same class>function hierarchy. You create an instance and get or set the variables or call the functions but in javascript you can extend your classes in very abstract way. You can create classes in another class and extend your application. The parent class gives you control on child classes and so on. There is one more important reason of using object oriented javascript! Javascript is alive after the execution. Object oriented architecture gives you more control on real time functionality.

A javascript class is just a function and you create an instance with the 'new' keyword.
A javascript class has two important elements, Prototype and Constructor.

1 Constructor: as you might know, java classes have a constructor function too which gets called after the instance is created and has the same name as the class itfself. PHP uses _construct and _destruct keywords for the same functionality. The constructor of javascript is simply it's body.

function MyFirstClass(){
//so everything wrapped in the body of
//MyFirstClass is it's constructor
alert("i am constructor");
}

//Now when i create an instance of MyFirstClass, i will get an alert "i am constructor".

new MyFirstClass();

you can use parameters as well in the constructor.


function MyFirstClass(count){
count++;
alert(count);
}

or define the inner variables with the hand of the parameters. Now see how i use the keyword 'this' in my class to scope the class itself


function MyFirstClass(count){
this.c = parseInt(count);
this.c++;

//now just define a function to get the value of c
this.getC = function(){
alert(this.c);
}
//and i call the function in the constructor
this.getC();
}

//now i am going to asign a variable for the instance and call the function getC again.

var k = new MyFirstClass(5);

//i get the alert in constructor but i will change the variable now and call the function getC again
//you can also call this function statically MyFirstClass.getC(); but it will throw an error since
//the variable c is not defined and the constructor doesn't run in this case

k.c = 10;
k.getC();

//this will alert 10. Notice, the constructor won't run again.

Scope is also an important element of javascript. Once you are out of constructor, you need a reference to access MyFirstClass since the scope is changed. That's why i always define a global variable with the keyword 'var' so the reference is created while the scope is still in the constructor.

function MyFirstClass(count){

//notice the _self variable

var _self = this;


this.c = parseInt(count);
this.c++;

//now just define a function to get the value of c
this.getC = function(){
//now i will just use _self global variable so the function is accessible from outside
alert(_self.c);
}

}

Now you can call the methods from outside of focus. For example event based
... onclick="k.getC();" ...

Ok guys. Next time i will continue with the prototype. See you later!