javascript - 模块模式 Javascript - this 绑定(bind)

Question

我有下面这段代码:

var myNamespace = (function() {

// A private counter variable
var myPrivateVar = 0;

// A private function which logs any arguments
var myPrivateMethod = function(foo) {
    console.log(foo);
    myPrivateMethod2();
};

var myPrivateMethod2 = function(foo) {
    console.log("Hi");
    myPrivateMethod3();
}

var myPrivateMethod3 = function() {
    console.log(3);
}

return {

    myPublicVar: "foo",

    myPublicFunction: function(bar) {

        myPrivateVar++;
        myPrivateMethod(bar);

    },

        myPublicFunction2: myPrivateMethod2
    };
})();

当调用 myPublicFunction 时，此上下文是窗口，但当调用 myPublicFunction2 时，此上下文是对象 myNamespace。我希望它在这两种情况下都是 myNamespace，因为调用站点是 myNamespace。为什么不一样？

Answer 1

上下文不是由您定义对象的方式定义的，而是由您调用其方法的方式定义的。因此，根据您如何进行此类调用，同一函数可能一次将 this 设置为某个对象，而另一次可能是其他对象。

可以使用bind、call、apply 和类似方法覆盖此行为。

当您这样调用时，上下文将设置为 myNamespace:

myNamespace.myPublicFunction2()

...因为前缀。但是，如果该函数将调用另一个函数，则确定上下文的规则将确定 this 在该嵌套函数调用中的内容。

所以在这段代码之后:

myNamespace.myPublicFunction()

... this 将按照您的预期进行设置，但是一旦调用就会丢失:

myPrivateMethod(bar);

那里没有前缀，因此 window 是该函数运行时的上下文(在非严格模式下)。

解决方案

您可以通过将调用替换为:

myPrivateMethod.call(this, bar);

同样，您希望对私有(private)方法的其他调用执行相同的操作:

myPrivateMethod2.call(this);
// ...
myPrivateMethod3.call(this);