CODEWITHSUNDEEP
javascriptoop
Jiew Meng
Jiew Meng

Reputation: 88197

JavaScript inheritance with _.extend()

Whats the difference between 

Employee.prototype = Object.create(Person.prototype);

and 

_.extend(Employee.prototype, Person.prototype);

Both give similar results (output), but the underscore method seems to add the Person.prototype to the Employee.constructor.prototype, and quite abit extra stuff here and there, why?

pure JS

enter image description here

underscoreJS

enter image description here

A nice side effect of _.extend is I can easily do multiple inheritance: seems like it doesnt make the prototype chain longer too ... 

_.extend(Employee.prototype, Person.prototype);
_.extend(Employee.prototype, {
    doSomething: function() {
        return "hi ...";
    }
});

But ...

enter image description here

Why is there 2 sayHi and doSomething functions? (actually its the same when I just do 1 extend).

http://jsfiddle.net/VMqSy/1/

Upvotes: 15

Views: 13343

Answers (1)

rdiazv
rdiazv

Reputation: 1153

With Employee.prototype = Object.create(Person.prototype); you are completely replacing the Employee.prototype.

But with _.extend(Employee.prototype, Person.prototype); you are adding the Person.prototype on top of the Employee.prototype.

For example,

var a = {var1:1, var2:2};
var b = {var2:4, var3:3};
console.log(_.extend(a, b)); // {var1:1, var2:4, var3:3}

As you see, a it's not completely replaced by b, it's just extended by the properties defined in b.

Upvotes: 19

Related Questions