Question

The code below is adapted from this answer

    function MessageClass() {
        var self = this;
        this.clickHander = function(e) { self.someoneClickedMe = true; };

        var _private = 0;
        this.getPrivate = function() { return _private; };
        this.setPrivate = function(val) { _private = val; };
    }

    ErrorMessageClass.prototype = new MessageClass();
    function ErrorMessageClass() {
        MessageClass.apply(this, arguments);
    }

    var errorA = new ErrorMessageClass();
    var errorB = new ErrorMessageClass();
    errorA.setPrivate('A');
    errorB.setPrivate('B');
    console.log(errorA.getPrivate()); 
    console.log(errorB.getPrivate());

The original post did not have the MessageClass.apply(this, arguments); since the purpose was to show how inheritance can go wrong in Javascript.

My question is, is saying: ErrorMessageClass.prototype = new MessageClass(); before the ErrorMessageClass constructor has even been declared bad practice? My understanding is that calling undeclared identifiers like that causes a silent declaration to occur, with the result being placed on the global window object, which I understand is bad.

Is this form:

    function ErrorMessageClass() {
        MessageClass.apply(this, arguments);
    }
    ErrorMessageClass.prototype = new MessageClass();

considered to be better practice? This link shows the code written as it was originally above, which is why I even tried it. Does this blogger know something I don’t (quite likely)?

EDIT

Lots of great info in the answers below, but I did want to highlight this link which really explains things perfectly

Answer 1

It works because function declarations are evaluated first. If you tried to move these classes under an object literal “namespace” the first version would fail.

I personally find the second method to be much easier to read – also, don’t forget to set the sub-class’ prototype.constructor property back to itself. Personally, I use an inherits() method on the Function prototype which wraps up essentially the type of code you’re using here.