FileReader读取文件后数组无法通过索引访问，求技术解决方案

核心问题：异步执行时机错误 #

FileReader的读取操作是异步的，reader.onload回调函数只会在文件读取完成后才会执行。但你当前代码中，在调用reader.readAsText(item)后立刻就执行了遍历finalString的for循环——这时候文件还没读完，finalString还是空数组，自然没有输出。

至于你说“打印整个数组却能正常工作”，是因为浏览器控制台会保留对数组的引用，当后续onload回调填充了数组内容后，控制台会动态更新显示这个数组的最新状态，并不是你打印的时候数组已经有内容了。

另外，代码里cur_index用var声明存在作用域隐患，建议换成let避免变量提升问题。

修复方案 #

方案1：将数组操作逻辑移到onload回调内部 #

把需要使用finalString的代码放到onload里面，确保是在数组填充完成后再执行：

function loadData(item) {
    let finalString = [];
    let reader = new FileReader();
    reader.onload = function (progressEvent) {
        var lines = this.result.split("\n");
        let cur_index; // 用let声明，作用域更清晰
        for (var line = 0; line < lines.length - 1; line++) {
            var tmpArray = lines[line].split("\t");
            if(line === 0){
                const isStatus = (element) => element.toLowerCase() === 'status';
                cur_index = tmpArray.findIndex(isStatus); 
            }else{
                // 先判断cur_index是否有效，避免找不到status列导致报错
                if(cur_index !== -1){
                    finalString.push(tmpArray[cur_index]);
                }
            }
        }
        // 数组填充完成后，在这里处理或遍历
        for(let item of finalString){
            console.log(item);
        }
        // 这里也可以调用其他需要使用finalString的函数
        // processFinalData(finalString);
    };
    reader.readAsText(item);
}

方案2：用Promise封装FileReader（更现代的异步处理方式） #

如果需要在loadData外部使用finalString，可以用Promise封装，配合async/await：

function readFileAsText(file) {
    return new Promise((resolve, reject) => {
        const reader = new FileReader();
        reader.onload = () => resolve(reader.result);
        reader.onerror = () => reject(reader.error);
        reader.readAsText(file);
    });
}

async function loadData(item) {
    let finalString = [];
    try {
        const result = await readFileAsText(item);
        const lines = result.split("\n");
        let cur_index;
        for (let line = 0; line < lines.length - 1; line++) {
            const tmpArray = lines[line].split("\t");
            if(line === 0){
                const isStatus = (element) => element.toLowerCase() === 'status';
                cur_index = tmpArray.findIndex(isStatus); 
            }else{
                if(cur_index !== -1){
                    finalString.push(tmpArray[cur_index]);
                }
            }
        }
        // 现在可以正常访问数组元素
        console.log(finalString[0]);
        for(let item of finalString){
            console.log(item);
        }
    } catch (err) {
        console.error('读取文件失败:', err);
    }
}

额外注意事项 #

• 增加了cur_index !== -1的判断，避免当文件第一行找不到status列时，tmpArray[cur_index]取到undefined或者报错。
• 数组声明用let finalString = []比new Array()更简洁常用。

内容的提问来源于stack exchange，提问作者Hamza-ally