Closure and this clarification?

javascript

Solution

The value of `this` is determined by the object you call the function through, not the place where the function is declared.

For example, if you did the following:

var f = o.f;
console.log(f());

you'd see that `this` is window as well.

You can also do stuff like this:

var o2 = { f: o.f };
console.log(o2.f());

There, `this` would be the o2 object, not o.

In your case, o.f is returning a function, which you're invoking without an object reference. In that case, the function invoked is called with `this` set to the global object (which in a browser is `window`).

If you want to preserve the `this` pointer, you'll need to capture it in a closure, like so:

var o = {
    f: function ()
    {
        var self = this;
        return function ()
        {
            console.log(self);
        }
    }
}
console.log(o.f()())

and then you'd have the right object reference regardless of how it's called.

Problem

I'm encountering with a little problem with the context of `this` : In JavaScript `this` always refers to the "owner" of the function we're executing, or rather, to the object that a function is a method of. So, this code : ``` var o={ f:function () { console.log(this); //the owner of the function is `o` } } console.log(o.f()) // this shows the `o` as this ``` all OK. So why this code ``` var o = { f: function () { return function () { console.log(this); } } } console.log(o.f()()) ``` Shows that `this` is the global object/window ? `o.f()` returns a function , and then I execute it.but still the Hoster object is `o`. so why it shows the hoster as `window`?

Original source

Related problems