读取文本文件内容Javascript[重复]

Question

我想访问“onload”功能之外的文件内容。我知道这与异步有关。下面是我的js函数：

function testZ() {
var entireFile = document.getElementById("input").files[0];
var reader = new FileReader();
reader.readAsText(entireFile, "UTF-8");
reader.onload = function (e) {
    var rawLog = reader.result;
    console.log(rawLog);
};

// access to file content

谢谢大家！

Answer 1

传统上，您可以使用这样的回调模式

function testZ(cb) {
    var entireFile = document.getElementById("input").files[0];
    var reader = new FileReader();
    reader.readAsText(entireFile, "UTF-8");
    reader.onload = function (e) {
        var rawLog = reader.result;
        cb(rawLog);
    };
}

testZ(contents => {
    // contents accessible here
})

或者，您可以使用Promises和async/await使代码看起来更像同步代码

function testZ() {
    return new Promise((resolve, reject) => {
        var entireFile = document.getElementById("input").files[0];
        var reader = new FileReader();
        reader.readAsText(entireFile, "UTF-8");
        reader.onload = () => resolve(reader.result);
        reader.onerror = reject;
    });
};
(async() => {
    const contents = await testZ();
    // contents accessible here
})();

注意：如果你在一个函数中，则不需要异步IIFE，只需使该函数异步 - 通常需要注意的是，该函数现在返回一个 Promise，所以不要指望它会产生同步结果

async someFunction() {
    const fileContent = await testZ();
    // contents accessible here
}

此外，顶级await在模块中可用-因此，在这种情况下根本不需要async函数-简单地说：

const fileContent = await testZ();
// contents accessible here