Question

我有点腌菜。

我已经创建了一个可爱的javascript插件。但后来我决定，如果我想要运行多个版本的插件，我将不得不创建它的多个实例。

但是......我注意到了一些事情，我的回调没有回调。由于需要引用脚本，我已经将罪魁祸首缩小到我无法再引用this的事实。

我的问题是这个（代码如下）。如何在Javascript中引用对象的实例，因为this不起作用。

这是代码片段。

以前

代码支架用于看起来像这样，它没有问题：

var list = (function () { //code }());

但是，所以我可以实例化我的对象，我改变它是这样的：

 var list = (function () { //code });

以前我会调用list.init（）;直接，现在我创建一个新的实例：

var test = new list("test");

在打电话之前。

列表对象中有几个函数，一个函数通过用数据填充对象然后将此对象传递给处理请求的脚本来触发ajax请求。在该对象中是一个函数，它是对该对象的回调，让我们来看看该方法：

   makeTemplateRequest = function () {
    console.log('make template request called');
    var send = new JaysHelpers.Ajax.sendObject();
    send.page = "/list.html",
    send.request = "widget",
    send.blockNumber = 0,
    send.numberOfItems = 1,
    send.filters = [],
    send.callBack = templateCallback;


    gateKeeper.request({
        speed: "now",
        sendObj: send,
        recur: false            
    });

},

问题在于：

     send.callBack = me.templateCallback;

这应该引用ajax插件调用的方法：

templateCallback = function(jsonObject, error){ //callbackcode },

但相反，它未定义＆＃39;。

我尝试了几件事，我尝试在脚本的本地空间中保留this为var me = this;但实际上保留了全局命名空间。我已尝试this.templateCallback，但这与前一个相同，我尝试在外部list.templateCallback调用它，但现在插件需要实例化，但不起作用。我已尝试在templateCallback本地引用它，但这并不起作用。

另请注意，这些功能通过以下方式公开：

    return {
    init: init,
    callback: callback,
    templateCallback: templateCallback      
};

问题

所以我的问题是这个，如何引用对象的this实例？

修改

更完整的代码：

var list = (function () {

"use strict";

var init = function (options) {


    //check and verify data passed in
   // if happy make the call below
    makeTemplateRequest();

},
makeTemplateRequest = function () {
    console.log('make template request called');
    var send = new JaysHelpers.Ajax.sendObject();
    send.page = "/list.html",
    send.request = "widget",
    send.blockNumber = 0,
    send.numberOfItems = 1,
    send.filters = [],
    send.callBack = templateCallback;

    gateKeeper.request({
        speed: "now",
        sendObj: send,
        recur: false            
    });

},

templateCallback = function (html, error) { var thisHtml = html || ""; //do stuff with returned data };

return {
    init: init,
    callback: callback,
    templateCallback: templateCallback      
};

}）;

Answer 1

代码

send.callBack = me.templateCallback;

会将函数引用分配给send.callBack，但不会保留me的值（在this调用期间templateCallback）。为此，您可以使用ES5的Function#bind（可以在较旧的浏览器上进行填充）：

send.callBack = me.templateCallback.bind(me);

Function#bind创建一个函数，在调用时，将调用原始函数，并将this设置为您提供的参数。

原因是当你调用一个函数时，调用中this的值几乎完全由你调用函数的 how 设置，而不是函数定义的位置或它附加的对象。

更多（在我的博客上）：

JavaScript回调到对象的实例＆＃39; undefined＆＃39;

1 个答案: