JavaScript inheritance extend function

Question

I'm having some trouble understanding the IF clause at the end of this function from Pro JavaScript Design Patterns:

function extend(subClass, superClass) {
    var F = function() {};
    F.prototype = superClass.prototype;
    subClass.prototype = new F();
    subClass.prototype.constructor = subClass;

    subClass.superclass = superClass.prototype;
    if(superClass.prototype.constructor == Object.prototype.constructor) {
        superClass.prototype.constructor = superClass;
    }
}

The book explains that these lines ensure that the superclass's constructor attribute is correctly set, even if the superclass is the Object class itself. Yet, if I omit those three lines and do the following:

function SubClass() {};
extend(SubClass, Object);

alert(Object.prototype.constructor == Object);

The alert says 'true', which means the superclass's constructor is set correctly even without those last three lines. Under what conditions, then, does this IF statement do something useful?

Thanks.

I have a question: why the intermediary function F, instead of just subClass.prototype = new superClass();? — 755
– 755, Commented Feb 19, 2013 at 10:00

Christian C. Salvadó · Accepted Answer · 2010-04-21 20:40:28Z

15

The problem that those two lines try to avoid, is generally produced when you replace the prototype property of a Constructor Function, for example:

function Foo () {};
Foo.prototype = {
  bar: 'baz'
};

var foo = new Foo();
foo.constructor === Object; // true, but `constructor` should refer to Foo

When functions objects are created, the prototype property is initialized with a new object, which contains a constructor property that refers to the function itself, e.g.:

function Bar () {};
var bar = new Bar();
bar.constructor === Bar; // true

When you replace the prototype property with another object, this object has it's own constructor property, generally inherited from other constructor, or from Object.prototype.

var newObj = {};
newObj.constructor === Object;

1 Comment

Zach Over a year ago

That clears it up for me. Thanks. The authors' explanation for this code is misleading. They should have said that it ensures that the superclass has not itself been improperly extended.

Collectives™ on Stack Overflow

JavaScript inheritance extend function

1 Answer 1

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related