My JavaScript book is out! Don't miss the opportunity to upgrade your beginner or average dev skills.

Wednesday, June 10, 2009

Wait A Moment, JavaScript Does Support Multiple Inheritance!

... we are just doing it wrong!

Classical Inheritance? We Have Something Better!

The main limit about multiple inheritance in JavaScript is the presence of "instanceof" operator. In a prototypal based inheritance objects simply inherits from objects, and class keyword is almost meaningless.

// generic constructor
function B(){};

// remember the prototype
var B1proto = B.prototype;

// B instance
var b1 = new B;

// prototype reassignment
B.prototype = {
constructor:B
};

// remember new prototype
var B2proto = B.prototype;

// B instance
var b2 = new B;

alert(b2 instanceof B); // true
alert(b1 instanceof B); // false

Above snippet demonstrates how inheritance and instanceof are related to the current prototype, rather than the function/constructor itself.
In few words, the function is the implicit init method for the current prototype object. The relation, as we could spot with FireFox, is with the prototype and not the used constructor.

// FireFox exposes __proto__
// will be Object.getPrototypeOf
// in ECMAScript 3.1
b1.__proto__ == B1proto; // true
b2.__proto__ == B2proto; // true


Sure, And What About Multiple Inheritance?

... I am going there, wait another few seconds :D
Since the prototype is the relation, and not the constructor, and since a prototype is nothing but a common Object, we can add whatever method or property we want to this prototype object in order to obtain the hybrid one we are looking for.

function A(){};
A.prototype.name = "A instance";
A.prototype.getName = function(){
return this.name;
};

function B(){};
B.prototype.name = "B instance";

function C(){};
// default name from B
C.prototype.name = B.prototype.name;
// getName from A
C.prototype.getName = A.prototype.getName;
// new method for C
C.prototype.setName = function(name){
this.name = name;
};

var c = new C();
c.getName(); // B instance
c.setName("Andrea");
c.getName(); // Andrea

In few words, we can add whatever we want to a prototype object creating exactly what multiple inheritance would create. We still have a problem with instanceof operator, don't we? Well, considering that "instance" concept is something more meaningful in classical inheritance, we could say that it is not possible to emulate multiple inheritance Python like with JavaScript, but we can inject whatever method/property from whatever constructor.prototype, something not possible with Java, PHP, C#, and others ... so are we missing something?

A Basic Object.implement Function Check

Due to the fact we could need to know if an hybrid instance is using this or that method, we could think about an abstract implement method able to tell us if a generic instance constructor prototype, is at least implementing another constructor prototype, considering latter one as an interface. If this is true, we are sure that we can use that instance/object in that way and without problems ... isn't it?

Object.implement = function(o, constructor){
// Another WebReflection Insane Snippet
if(o instanceof constructor)
// nothing to check
// classical boring stuff
return true;
// let's check if things are OK
var k, b = true,
// take the instance constructor prototype
po = o.constructor.prototype,
// take the implemented prototype
pc = constructor.prototype
;
// for each property or method
// in the implemented constructor
for(k in pc)
// check if the instance inherited prototype
// has this method/property as well
b = b && k in po; //* TOTHINK: */ && (typeof po[k] === typeof pc[k]); //*/
// if there was nothing to check
// we cannot say a word ... but ...
// if instance has every method/property
// present in the compared constructor
// prototype, we could say this instance
// implements this constructor
return !!k && b;
};

Purist Classical OOP Developers are probably already rolling around the floor in pain and screaming he's f#@*in idiot, but what is the meaning of implement in classical inheritance patterns?
Wikipedia - Interface

Interfaces are used to encode similarities which classes of various types share, but do not necessarily constitute a class relationship

In few words my latest snippet checks if an object contains every method/property defined in another object so, using first example, we could do:

// add noise and chaos with another constructor ...
function D(){};
D.prototype.notInObject = true;

// check Object.implement ...
Object.implement(c, A); // true
Object.implement(c, B); // true
Object.implement(c, C); // true
Object.implement(c, D); // false


Nothing new? Nothing true? Is it clear for everybody? 8-)

6 comments:

Unknown said...

Good post. There is an easier way to check for the "Object.implement" functionality (or instance relationships). It is described in the JS 1.5 Core Guide here:

https://developer.mozilla.org/en/Core_JavaScript_1.5_Guide/Property_Inheritance_Revisited/Determining_Instance_Relationships"

Since prototypes can have prototypes, the check can be implemented like:


function instanceOf(object, constructor) {
while (object != null) {
if (object == constructor.prototype)
return true;
object = object.__proto__;
}
return false;
}

a.in.the.k (@ainthek) said...

Multipe inheritance:
Your sample is fine, but what if .name is not defined on prototype but on instance (it is array or other ref type and you do not want to share it across instances). Usually it is initialized inside constructor.

Would you call the A and B constructors from inside C constructor ? What if both extesions (A and B) use coliding member variable names ?

How would you suggest to solve this issue ?

Luz said...

Your code does not inherit. In inheritance, future changes to inherited properties should affect all current instances.

function A(){};
A.prototype.name = "A instance";
A.prototype.getName = function(){
return this.name;
};

function B(){};
B.prototype.name = "B instance";

function C(){};
// default name from B
C.prototype.name = B.prototype.name;
// getName from A
C.prototype.getName = A.prototype.getName;
// new method for C
C.prototype.setName = function(name){
this.name = name;
};

var c = new C();

alert( c.name ) // "B instance"

B.prototype.name = "test"

alert( c.name ) // "B instance"

Note that c.name did not change but should have. All your code did was to copy .name from B to c rather than inherit.

Andrea Giammarchi said...

you realize I wrote a Class and tons of other things from 2009 ... right? ... good

Nicolas said...

There is this library that implements multiple inheritance the same way Python does: http://ringjs.neoname.eu . Why not take a look at it?

Andrea Giammarchi said...

right now there ie an `Object.mixin` proposal in ES6 that will make multiple traits and mixin possible, easy, in core