javascript - 从异步调用访问成员方法

Question

这个问题已经有答案了:

How to access the correct `this` inside a callback (15 个回答)

已关闭 9 年前。

我正在尝试从代码异步调用的方法访问我的“类”中的方法。

这是我减少的类(class):

function FileProcessor(file, callback) {    
    this.file = file;
    this.callback = callback;
}

FileProcessor.prototype.readerOnload = function(e) {
    this.callback(e.target.result);
};

FileProcessor.prototype.process = function() {
    var reader = new FileReader();
    reader.onload = this.readerOnload;

    if (this.file.type == 'text/xml') {
        reader.readAsText(this.file);
    }
};

我对 this.callback 的调用在构造函数 FileProcess 中工作，在 process() 中工作，但在 readerOnload 中不起作用。我得到:

未捕获类型错误:未定义不是函数

知道我做错了什么吗？

谢谢

Answer 1

我认为您的 readerOnLoad 函数是在与您预期不同的上下文中调用的，并且您最终得到的 this 值不是 FileProcessor 的实例.

试试这个:

reader.onload = this.readerOnload.bind(this);

或者，如果您必须支持旧版浏览器:

var self = this;
reader.onload = function(e) { self.readerOnLoad(e); };