Javascript 避免丢失此引用及其原因';发生什么事了

Javascript 避免丢失此引用及其原因';发生什么事了,javascript,callback,this,module-pattern,Javascript,Callback,This,Module Pattern,我这把小提琴有个错误--> (这是没有错误的版本)--> 其中有一个模块(与主应用程序类似),一个处理Ajax调用的Module.AjaxInterface,一个Module.Modules.Inbox(执行与电子邮件收件箱相关的任务),以及一个处理多个模块以显示页面的Module.Pages.Gmail。所有这些都是使用模块模式完成的 现在,您可以看到有很多回调。我想知道在这些通话中,这个会发生什么 我不明白的是此引用发生了什么,以及如何保存它: getMessages: function(p

我这把小提琴有个错误--> (这是没有错误的版本)-->

其中有一个模块(与主应用程序类似),一个处理Ajax调用的
Module.AjaxInterface
,一个
Module.Modules.Inbox
(执行与电子邮件收件箱相关的任务),以及一个处理多个模块以显示页面的
Module.Pages.Gmail
。所有这些都是使用模块模式完成的

现在,您可以看到有很多回调。我想知道在这些通话中,
这个
会发生什么

我不明白的是
引用发生了什么,以及如何保存它:

getMessages: function(params) {
                var parameters = params || {};
                params = {
                    // Please note I'm using this, which equals the module
                    successCallback: this.pretendRender,
                    successCallbackParameters: parameters,
                    json: params.json
                };
                var test = new Module.AjaxInterface(params);
                test.ajaxCall();
            },
因此,对模块内部函数的调用本身是有效的。。。然后,它调用
test.ajaxCalls
,后者反过来调用
invokeRender()
。现在,在虚拟世界里,我有一个:

 pretendRender: function(data, parameters) {
                // LINE 106 that is causing the ERROR
                // It says "this.addColor() is not defined and THIS = window now
                data.color = this.addColor();
                parameters.successCallback(data);
            },

            addColor: function() {
              return "#AD9";
           }

我的问题是。。。
引用发生了什么变化?为什么要更改为
窗口
?我怎样才能修好它?我知道我可以使用
call
apply
,但函数
invokerender
正在
ajax界面上调用,对
模块的引用已丢失(除非我使用
调用者
,我不能在
严格的
下使用)。我知道我可以将
这个
传递给
Ajax接口
来保存它,但我真正想要的是真正理解正在发生的事情并创建一个优雅的解决方案。

这个
始终是调用函数的对象。它改变了
this.defaultRender
不是在该时间点附加到
this
对象的方法。它只是一个正在传递的函数。如果要保证
在该上下文中随方法一起移动,则需要
绑定到该函数。类似这样的内容(使用闭包):


Underline.js框架使用
.bind()

可以更好地实现这一点。该
始终是调用函数的对象。它改变了
this.defaultRender
不是在该时间点附加到
this
对象的方法。它只是一个正在传递的函数。如果要保证
在该上下文中随方法一起移动,则需要
绑定到该函数。类似这样的内容(使用闭包):


Underline.js框架使用
.bind()
做这件事有一个相当好的方法。它只是一个函数的引用/指针,调用函数时的
上下文取决于很多因素:

a.b.c = this.pretendRender;
a.b.c(); 
将是
b
内部的
c
,因为
c
引用的函数被称为
b


将设置为
全局对象
,因为
a
引用的函数被称为
全局对象的属性


c
中的
this
将是原始的
this
,因为
c
引用的函数是一个绑定函数,它调用原始函数并将上下文设置为原始
this
.bind
存在于现代浏览器中,但它是可用的


这个
将是
someObject
内部的
c
,因为它是显式给定的


因为您使用的是jQuery,而不是
this.invokeRender.bind(this)
您可以使用
successCallback:$.proxy(this.render,this)


此函数仅是函数的引用/指针,调用函数时此函数的上下文取决于许多因素:

a.b.c = this.pretendRender;
a.b.c(); 
将是
b
内部的
c
,因为
c
引用的函数被称为
b


将设置为
全局对象
,因为
a
引用的函数被称为
全局对象的属性


c
中的
this
将是原始的
this
,因为
c
引用的函数是一个绑定函数,它调用原始函数并将上下文设置为原始
this
.bind
存在于现代浏览器中,但它是可用的


这个
将是
someObject
内部的
c
,因为它是显式给定的


因为您使用的是jQuery,而不是
this.invokeRender.bind(this)
您可以使用
successCallback:$.proxy(this.render,this)


谢谢您的解释。。。但我正在执行successCallback:
this.invokeRender
,(也就是说,将引用传递给该函数,而不是调用函数本身)。如果我这样做
me.render.apply(me,参数),我不是在调用函数吗?此外,该函数的参数应用于
Module.AjaxInterface
,该函数在那里执行,在
回调(数据、参数)中调用其引用这就是为什么我不知道如何使用apply,因为函数引用被传递,然后在另一个模块中执行。如果不是为
函数(){…}
包装调用,它将被调用。这将创建一个匿名函数,稍后将调用该函数,该函数将
this
引用保存在
me
变量中。好的,我尝试了
successCallback:function(data){return me.invokerender.call(me,data);
,该函数返回的
addColor未定义
(在此js小提琴-->)谢谢你的解释…但我做的很成功回调:window.a = this.pretendRender; a();
a.b.c = this.pretendRender.bind( this );
a.b.c();
a.b.c = this.pretendRender;
a.b.c.call( someObject );