Question

简化示例：

// Let's create a new object
function MyObject() {
    //
}

// Add some method to this object
MyObject.prototype.myFunctionA = function() {
    //
}

// Another method
MyObject.prototype.myFunctionB = function(arg) {
    // AJAX GET request          
    $.get('script.php', { par : arg }, function(data) {

        // and here in the callback function    
        // I need to call MyObject.prototype.myFunctionA method!
        // but "this" references callback function so
        // I don't know how to access MyObject here

    });
}

我在评论中解释了我的问题。我怎么能这样做？

Answer 1

简单的：

// Let's create a new object
function MyObject() {
    //
}

// Add some method to this object
MyObject.prototype.myFunctionA = function() {
    //
}

// Another method
MyObject.prototype.myFunctionB = function(arg) {
    // AJAX GET request       
    var me = this;   
    $.get('script.php', { par : arg }, function(data) {
        // use me.something instead of this.something
    });
}

可重用（使用范围陷阱）：

function createDelegate(obj, handler)
{
    return function() {
        handler.apply(obj, arguments);
    }
}

然后

MyObject.prototype.myFunctionB = function(arg) {
    // AJAX GET request       
    var me = this;   
    $.get(
        'script.php', 
        { par : arg },
        createDelegate(this, function(data) {
        // use this.something
        })
    );
}

因此，与下面的评论相关的一些代码，createDelegate也可以用几种不同的方式使用，其中一种方式是：

function createDelegate(obj, handler)
{
    handler = handler || this;
    return function() {
        handler.apply(obj, arguments);
    }
}

Function.prototype.createDelegate = createDelegate;

这允许你做以下事情：

var someObj = {a:1, b:function() {return this.a;}};
var scopedDelegateForCallback = someObj.b.createDelegate(whateverobj)

你也可以做父母的伎俩，但这对我来说太麻烦了。

或者，您可以这样做：

function createDelegate(handler, obj)
{
    obj = obj || this;
    return function() {
        handler.apply(obj, arguments);
    }
}

Object.prototype.createDelegate = createDelegate;

并使用它：

someObj.createDelegate(someObj.b);

或者也许：

function createDelegateForMember(handlerName, obj)
{
    obj = obj || this;
    return function() {
        obj[handlerName].apply(obj, arguments);
    }
}

Object.prototype.createDelegate = createDelegateForMember;

然后

someobj.createDelegate("b");

Answer 2

你可以在调用$ .get之前在MyObject.prototype.myFunctionB中指定“var self = this” 那么你可以在回调中使用别名“self”。

MyObject.prototype.myFunctionB = function(arg) {
    var self = this;

    $.get('script.php', { par : arg }, function(data) {
       alert(self);
    });
}

Answer 3

JavaScript函数“close over”外部作用域中的变量，因此您可以执行此操作：

// Another method
MyObject.prototype.myFunctionB = function(arg) {
    // Save `this` reference for use in callback.
    var that = this;

    // AJAX GET request
    $.get('script.php', { par : arg }, function(data) {

        // Now `that` holds the contents of the current `MyObject`.
        // So you can call other methods.
        that.myFunctionA();
        // ... etc ...

    });
}

在ajax回调函数中引用外部对象

3 个答案: