Search code examples
javascriptvariable-declarationreferenceerrorhoisting

Why is no ReferenceError being thrown if a variable is used before it’s declared?


I’m trying to wrap my head around the behavior of reference errors thrown in JavaScript.

In the following example, a ReferenceError is thrown at the second line, and execution breaks:

var obj = {};
obj.func1 = func2;

alert('Completed');

Whereas in this example, the code completes successfully, though obj.func1 remains undefined:

var obj = {};
obj.func1 = func2;

var func2 = function() {
    alert('func2');
};

alert('Completed');

My assumption was that an error would be thrown at the second line just the same, and when that wasn’t the case, I’d have expected obj.func1 to properly reference func2, but I’ve been double blind-sided. So what exactly is going on here?


Solution

  • var is hoisted; the variable exists throughout the current scope. Thus, the second example is equivalent to:

    var obj;
    var func2;
    
    obj = {};
    obj.func1 = func2;
    func2 = function() {
        alert('func2');
    }
    
    alert('Completed');
    

    Thus, when you do the assignment, The name func2 is known, but undefined. In the first example, it is unknown, which raises ReferenceError.