Javascript FileReader:提取文本

Javascript FileReader: Extracting text

本文关键字：取文本 提取 FileReader Javascript      更新时间：2023-09-26

我在保存从FileReader读取的文件中提取的数据时遇到问题。

在onload函数的作用域中，数据似乎存在，但试图将所述数据存储在作用域之外的变量中似乎不起作用。

MWE：http://jsfiddle.net/eqaw0hbf/1/

（上传任何文本文件，你就会明白我的意思）

我倾向于说onload函数是异步的。换句话说，它在加载结束时触发并仅执行"函数（e）｛｝"作用域（因此得名"onloadend"）。与此同时，在等待加载结束的同时，"函数（e）｛｝"范围之外的程序的其余部分将继续执行。这并不是说数据没有存储在文本变量中。简单地说，第14行"alert（text）"调用发生在"function（e）｛｝"作用域有机会将"text"变量设置为非空变量之前。

按原样，您的代码将开始执行第2-3行，然后跳到第10行（并打印警报（文本），它只是"，因为函数（e）从未执行过，因此文本从未设置为任何内容）。当"lr.onloadend"的服务器或请求最终接收到其数据时，您的程序将跳回第6行，执行lr.onladend=function（e）｛｝中的作用域并设置文本变量。

您应该做的是将依赖于文本的任何数据处理放在onload的回调中，放在这个范围内：lr.onloadend = function(e){}。基本上，只要您有一个异步函数，内部发生的任何事情都应该被认为是在任何更高范围的所有代码之后发生的。任何不在"回调"函数中的内容都将按照您期望的顺序正常执行。只有当回调被触发时，回调函数内部的任何事情才会发生。因此，不能让回调函数外的事情依赖于回调函数内发生的事情。不能保证异步回调中的信息集（无论何时都可以"触发"）可以在其他地方使用。

这个链接很好地解释了Node.js/Javascript:中的回调

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

这是因为它或多或少是异步运行的。系统正在等待事件加载结束，然后设置文本变量。

你可以通过在最后一次警报之前进行某种延迟来看到这种情况的发生。

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);
    };
相关文章：