About Me

My photo
Talk to me... you will know

Friday, February 17, 2012

Inheritance in Javascript



Javascript has grown a lot from what i remember of working on it.. I remember the plain javascript i used to work on which now has advanced a lot to include inheritance and other OOP concepts. To understand more i tried an example to understand its reaches...

It's extremely hard to understand for those with classic OOP background but JavaScript has no Classes, just objects, where functions are first class objects but still objects!
Assumed this, we can try in any case to think about a JavaScript Class as a "function which aim is to create instances of function itself".
try with Mootools or some other library
new Class({}) instanceof Class;
 FALSE, since Class returns a function
 and not the created instanceof Class
 Nothing more and nothing less. The fact we would like to use that function to create and initialize instances is just how every Functions work, or if we prefer, a developer convention and a quick way to chain a prototype into an object.
 Since a Class is a Function, and whatever "new Class()" will always be an "instanceof Function", Class.prototype should be exactly the Function.prototype one, so that nobody can ever say again: "Look, I have created a Class".. All that has been made is a function..  But its still elastic




<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Page Start</title>
<script type="text/javascript">
/*Class declared: Person*/
Person = function(id, name, age){
    this.id = id;
    this.name = name;
    this.age = age;
    alert('Accepting Person Object');
}
/*properties of person class*/
Person.prototype = {
    wakeUp: function() {
        alert('I am awake');
    },
    getAge: function() {
        return this.age;
    },
    
    toStringHere : function() {
        return "id : "+this.id+", name : "+this.name+", age : "+this.age;
    }
}


Person.prototype.fly = function(){
alert("finally i can fly");
}
/*An instance to help inherit the properties*/
Inheritance_Manager = {};
/*DOM extension mechanism || Simple extension through object*/
Inheritance_Manager.extend = function(subClass, baseClass) {
    function inheritance() { }
    inheritance.prototype = baseClass.prototype;
    subClass.prototype = new inheritance();
    subClass.prototype.constructor = subClass;
    subClass.baseConstructor = baseClass;
    subClass.superClass = baseClass.prototype;
}
/*Class Declared : Manager */
Manager = function(id, name, age, salary) {
alert('Registering Manager');
    Manager.baseConstructor.call(this, id, name, age);
    this.salary = salary;
    alert("Registration Complete");
}
/*Manager Inherits Person and its handling of constructor*/
Inheritance_Manager.extend(Manager, Person);


Manager.prototype.lead = function(){
   alert('I am a good leader');
}
/*use objects to check how the various functions are accessed*/
var p = new Person(1, 'RAS', 22);
document.write(p.toStringHere()+"<br>");
var pm = new Manager(1, 'Ajo Koshy', 22, '27000');
document.write(pm.toStringHere()+"<br>");
</script>
</head>
</html>

No comments:

Post a Comment