Question

我试图从一个方法内部访问一个对象的成员变量，该方法作为在filereader事件期间触发的回调传递。

我将下面的代码鞭打在一起，试图传达我的观点。看起来＆＃39;这个＆＃39;成为文件读取器而不是调用点处的对象。有没有办法让finishLoading能够访问对象变量？

我想确保回调是针对对象定制的，否则我只是将它们定义为类外的静态函数。

function myClass(newName)
{
    this.name = newName;
    this.m_fileReader = new FileReader();

    this.finishedLoading = 
        function(param1)
        {
            alert(this.name);
        };

    this.m_fileReader.addEventListener('loadend',  
                                       this.callback_finishedLoading, 
                                       false);
}

var instance = new myClass('timmy');
var instance2 = new myClass('joe');

Answer 1

您需要.bind功能：

this.m_fileReader.addEventListener('loadend',
    this.callback_finishedLoading.bind(this),
    false);

.bind函数将接受传递的参数，并使用该参数调用原始函数作为其this，而不是浏览器尝试提供的任何值。

或者，只需为this创建自己的别名，并将您的调用包装在匿名函数中：

var self = this;
this.m_fileReader.addEventListener('loadend', function(ev) { 
    self.callback_finishedLoading(ev)
}, false);

后者主要是 .bind在幕后所做的事情，但它的优势在于它可以在没有垫片的ES5之前的浏览器上运行。

Answer 2

您可以让构造函数实现 EventListener 接口，如下所示：

function myClass(newName) {
    this.name = newName;
    this.m_fileReader = new FileReader();
    this.m_fileReader.addEventListener('loadend', this, false);
}

myClass.prototype.handleEvent = function(event) {
    return this[event.type] && this[event.type](event)
}

myClass.prototype.loadend = function(event) {
    alert(this.name);
};

var instance = new myClass('timmy');
var instance2 = new myClass('joe');

我将finishedLoading重命名为loadend，并将其放在构造函数的.prototype上。然后我向.handleEvent添加了.prototype方法。

最后在构造函数中，我们根本没有传递函数。而只是传递this，这是您的myClass实例。

我删除了您的param1，因为目前还不清楚如何使用它。如果需要从其他调用中获取某些值，则可以在finishedLoading上创建单独的.prototype方法，并使用.loadend()方法调用它。

Answer 3

this与上下文有关。每次打开新块{}时，它都会更改为当前块上下文。在调用回调函数之前，将this保存到另一个变量。

传递方法作为回调的javascript问题

3 个答案: