Question

Okay, I stumbled upon this piece of code..

How come this works? What sort of evil scheme does JavaScript use to resolve variables?

The way I see it, as a C++ kind of guy: the class/object definition contains a non-existent reference to an object of the class being defined. Seriously, how?

(To be honest, I understand partially – I could deduce a strawman concept of how and when JS resolves names.. but maybe this way the question will be of more use to someone else, someday)

Guilty code:

function Sio() {
    this.someValue = 5;
    this.doStuff = function() {
        console.log("look: "+howDoYouResolveThisYouFoulCreature.someValue);
    };
}

var howDoYouResolveThisYouFoulCreature = new Sio();

That seems so wrong.

Answer 1

Lots of concepts here, and I’m not sure which one is giving you troubles…

The two most likely ones are new / this and var.

new / this

When you call a function the value of this is determined by the context in which you call it.

If you use the new keyword, you create an instance of the function and make that instance the context.

When you call howDoYouResolveThisYouFoulCreature.doStuff() you are accessing that instance as a global. It would usually make more sense to:

this.doStuff = function() {
    console.log("look: "+ this.someValue);
};

Since foo.doStuff() makes foo the context for that invokation of doStuff() (which makes the function reusable between different instances of Sio)

var

1. Scope in JavaScript is at the function level.
2. Using var something anywhere inside a function will scope that variable to that function
3. It is considered good practise to use a single var statement at the top of a function to avoid confusion

Also, the doStuff function is not called before howDoYouResolveThisYouFoulCreature has a value. Until that point all that matters is that the function is syntactically correct, it doesn’t matter what type the variable is.