Question

我无法保留从FileReader读入的文件中提取的数据。

在onload函数的范围内，数据似乎存在，但是尝试将所述数据存储在范围之外的变量中似乎不起作用。

（上传任何文本文件，你会看到我的意思）

Answer 1

我倾向于说onload函数是异步的。换句话说，它触发并仅执行＆＃34;函数（e）{}＆＃34;加载结束时的范围（因此名称＆＃34; onloadend＆＃34;）。同时，你的程序的其余部分超出了＆＃34;函数（e）{}＆＃34;的范围。将在等待加载结束时继续执行。并不是数据没有存储在文本变量中。只需要第14行＆＃34;警告（文本）＆＃34;呼叫正在发生之前＆＃34;功能（e）{}＆＃34;范围有机会设置＆＃39;文本＆＃39;变量不是空的。

你的代码将启动并执行第2-3行，然后跳转到第10行（并打印警告（文本），这只是＆＃34;＆＃34;因为函数（e）从未执行过，因此文本从来没有设置任何东西）。当服务器或请求是＆＃34; lr.onloadend＆＃34;最后收到数据然后你的程序将跳回到第6行并在lr.onloadend = function（e）{}中执行范围并设置文本变量。

您应该做的是在此范围内放置依赖于onload回调的文本的任何数据处理：lr.onloadend = function(e){}。基本上每当你有一个异步函数时，应该假定在任何更高范围内的所有代码之后发生在内部发生的任何事情。任何不在＆＃34;回调中的东西＆＃34;函数将按照您期望的顺序正常执行。回调函数内部的任何内容只有在回调被触发时才会发生。因此，您无法使回调函数之外的内容依赖于回调函数内发生的事情。无法保证在异步回调中设置的信息可以触发＆＃39;什么时候准备好在其他任何地方使用。

此链接在解释Node.js / Javascript中的回调方面做得不错：

http://cwbuecheler.com/web/tutorials/2013/javascript-callbacks/

Answer 2

那是因为它或多或少地异步运行。系统正在等待事件onloadend，然后设置文本变量。

你可以通过在上一次警报之前加入某种延迟来看到这种情况。

function DoData(file) {                
    var lr = new FileReader();
    var text = "";

    lr.onloadend = function(e){
        text = e.target.result;
    };
    lr.readAsText(file);
    // this will display the correct result, after a delay of 1 second
    setTimeout(function() {alert(text)}, 1000);
    // this will display a blank string, 
    // because the text hasn't been loaded yet
    alert(text);
}

通常，您要做的是在onloadend事件中添加文本变量的处理函数。这是唯一一次您知道文本变量已正确初始化的时间。

    lr.onloadend = function(e){
        text = e.target.result;
        functionToProcessText(text);
    };

Javascript FileReader：提取文本

2 个答案: