0

I've been following along a blog post on JavaScript inheritance. I wanted to slightly adapt this and try to write something more like I've seen in Backbone (extend method). See I set about it, and run into problems. Then I came across this SO post. It was so much simpler. So after some minor tweaks to that I set about writing a way each extended constructor could have their own extend method (inherited from Base). This is what I have:

var Base = function(name){
    this.name = name;
}
Base.prototype.extend = function(new_constructor){
    //new_constructor.prototype = new this.constructor();
    new_constructor.prototype = Object.create(this.constructor.prototype);
    new_constructor.prototype.constructor = new_constructor;

    return new_constructor;
}

var Robot = Base.prototype.extend(function(name, material){
    Base.call(this, name)
    this.material = material
    this.type = 'robot';
});

var T1000 = Robot.prototype.extend(function(options){
    Robot.call(this, options.name, options.material)
    this.guns = options.guns;
    this.type = 'killer robot';
});

robot = new Robot("Boutros", "metal");
t1000 = new T1000({name: "Arnie", material:"flesh/metal", guns:3});

console.log(robot)
console.log(t1000)

Anyway seems to work, but I'm a little new to this. Can anyone suggest any limitations with this approach. I'd like to use something like this when I create objects in JavaScript but don't want to run into any issues later on. Would appreciate your feedback.

Btw, here is my jsFiddle

Community
  • 1
  • 1
Martyn
  • 6,031
  • 12
  • 55
  • 121

1 Answers1

0

Your extend function does everything to do prototypical inheritance correctly.

However, it doesn't make much sense to place it on the prototype of Base. Why should robot or t1000 inherit this method? It doesn't do what you would expect from it (t2000 = t1000.extend(…)?).

You'd better make it a static method:

function extend(parent_constructor, new_constructor) {
    new_constructor.prototype = Object.create(parent_constructor.prototype);
    new_constructor.prototype.constructor = new_constructor;
    return new_constructor;
}

var Base = function(name){
    …
};
var Robot = extend(Base, function(name, material){
    …
});
var T1000 = extend(Robot, function(options){
    …
});

Or you make it a method of all constructor functions, by placing it on the native Function.prototype:

Function.prototype.extend = function(new_constructor) {
    new_constructor.prototype = Object.create(this.prototype);
    new_constructor.prototype.constructor = new_constructor;
    return new_constructor;
}

var Base = function(name){
    …
};
var Robot = Base.extend(function(name, material){
    …
});
var T1000 = Robot.extend(function(options){
    …
});
Bergi
  • 630,263
  • 148
  • 957
  • 1,375