specifics of closures in JavaScript and anonymous functions

Question

This code results in "!" being logged on the console.

var g = {};
(function() {
    var t = this;
    t.x = "x";
    g.a = function() {
        console.log(t.x);
    };
})();

(function() {
    var t = this;
    t.x = "!";
    g.b = function() {
        console.log(t.x);
    };
})();

g.a();

Do anonymous functions share a this? Am I using this wrong? I don't really understand what's going on here.

I'd like for g.a() to continue returning the value of x defined in the first anonymous function.

I'm using node.js if it makes a difference.

Answer 1

In the immediate functions, this refers to the global object ^[docs]. So in this case in both functions this indeed refers to the same element and you are overwriting x with the second call.

What object this refers to is determined by how the function is called.

• If you just execute a function with funcName();, then this refers to the global object.
• If the function is assigned to a property of an object, obj.funcName() , this refers to the object.
• If you call the function with the new operator, new funcName();, this refers to an empty object that inherits from the functions prototype.

You can also explicitly set this by using call ^[docs] or apply ^[docs].

---

Instead referring to this, you could create a new object in both functions:

var t = {};

---

Additional note: It makes no difference whether you run the code in the browser or with node.js. The global object is part of the specification and has to be provided by the execution environment. In browsers it is the window object, I don't what it is in node.js, but it does not matter as long as it follows the specification.