Inheritance

Now we come to the big one - inheritance. Most traditional object oriented language make a big thing out of inheritance. There are even complex design methodologies based around the notion of an inheritance hierarchy. However in JavaScript there is no notion of type and no need for a type hierarchy. In the same way there is no real need to implement classical hierarchical inheritance - it is too much of a straightjacket. 

In JavaScript objects acquire and dispose of properties and methods at run time and change what they can do and what data they can store. In JavaScript inheritance is replaced by a range of pragmatic ways of adding and removing properties/methods. After all if object A inherits from object B then all this means is that object B has all of the properties and methods of object A by default. So any mechanism you care to invent that clones the properties and methods of a JavaScript object into a new object does the same job as inheritance.

The simplest way to do this is to call object A's factory function within object B's factory function - but there are lots of other ways of doing the same job.

For example, first create an object factory for A:

var myObjectA = function(){
 return {
          myProperty1: "data1",
          myMethod1: function(){
               alert(this.myProperty1);
          }
        }
}

Notice that in this factory we use this and an object literal. After this we can create instances of the object using:

var objA=myObjectA();
objA.myMethod1();

Now if we want an object B that has all the properties of object A we can use:

var myObjectB = function(){
 var obj = {};
 obj = myObjectA();
 obj.myProperty2 = "data2";
 return obj;
}

Notice that in this case we have to use the closure form of an object factory because we need to create an instance of the base object and then add to it. After this we can use methods and properties inherited from object A in object B e.g.

var objB = myObjectB();
objB.myMethod1();

So you can have inheritance simply by using object factories to create base instances and then adding to them.

This is more in keeping with the JavaScript way of doing things.

Prototypal what?

But wait! What about prototype?

If you know how the prototype mechanism works you may well think that it is the core of JavaScript inheritance. It isn't. It is simply a way of making inheritance more efficient and most of the time you can do without it.

When you create an object constructor, i.e. an object factory that you use with the new operator, there is an additional action. The object that you create has its prototype property set to reference the constructor function's prototype property. Any functions or properties that cannot be found in the object created by the constructor are looked up and if found used in the constructor's prototype object.

This looks a lot like inheritance because if you set the constructors prototype property to another object then the object so constructed has all of the properties and methods of the prototype object. However this is not quite as it seems. There is only one prototype object for all of the objects created by the constructor and this means that all of the objects share the same code for all the inherited methods

This is more efficient but you could have created the same inheritance without using the complex prototype mechanism by simply using nested object factories as shown above.

When you analyse it the only reason for using the over complex prototype inheritance mechanisms is to reduce the storage needed for multiple copies of an object. In the case of most JavaScript objects there just aren't enough instances to warrant the trouble it causes to code share via the prototype property.

JavaScript's JavaScript

In short the prototype mechanism isn't so much about inheritance as it is about efficiency. Unless you are creating lots of copies or near copies of the same object you can ignore it.

So to write JavaScript in its own style you need to forget class, type, type hierarchies, inheritance hierarchies and mostly ignore the prototype mechanism.

• JavaScript doesn't have a type system. Never ask "what type is this" - it is meaningless.

• It simply has objects that are created dynamically and which acquire and dispose of properties and methods at run time.

• All that matters is that the object you are trying to use has the method or property that you are trying to use.

JavaScript only lives in the run time.

If you would like to be informed about new articles on I Programmer you can either follow us on Twitter, on Facebook , on Digg or you can subscribe to our weekly newsletter.

<ASIN:0137054890>

<ASIN:0596517742>

<ASIN:1590597273>