Why can't IIFE/function access “this” in outer

问题:

This question already has an answer here:

• How does the “this” keyword work? 22 answers

In the following code,

var myObject = {
    foo: "bar",
    func: function() {
        var self = this;
        console.log("outer func:  this.foo = " + this.foo);
        console.log("outer func:  self.foo = " + self.foo);
        (function() {
            console.log("inner func:  this.foo = " + this.foo);
            console.log("inner func:  self.foo = " + self.foo);
        }());
    }
};
myObject.func();

It prints this in the console:

outer func:  this.foo = bar
outer func:  self.foo = bar
inner func:  this.foo = undefined
inner func:  self.foo = bar

The first two are pretty obvious, but I don't understand for the third and fourth one, why does the IIFE has access to self but doesn't have the access for this? I thought it creates a closure so it has access to the outer variables self and this ?

回答1:

I'm not certain that this solves your problem, but you can bind this by passing it as an argument to the IIFE:

(function(context) {
    console.log("inner func:  context.foo = " + context.foo);
    console.log("inner func:  self.foo = " + self.foo);
}(this));

Fiddle