如何用JavaScript的fetch将本地文件内容保存到变量？

你的代码里console.log(fileText)输出undefined，核心原因是fetch是异步操作：代码执行顺序是先声明fileText，发起fetch请求后，不等请求完成就直接执行了console.log，这时候文本还没获取到，变量自然是空的。

给你两种可行的解决方法：

方法一：将逻辑放在then回调内 #

把所有需要使用fileText的代码，都放到fetch的then回调里，确保只有在文本获取完成后才执行：

let fileText;
fetch("./text.txt")
    .then(response => response.text())
    .then(text => {
        fileText = text;
        console.log(fileText); // 这里能正常输出文本内容
        // 所有依赖fileText的业务逻辑都写在这里
    });

方法二：使用async/await简化异步代码 #

用async/await语法让异步代码看起来像同步执行，逻辑更清晰：

async function getFileContent() {
    let fileText;
    // 等待fetch请求完成
    const response = await fetch("./text.txt");
    // 等待文本解析完成
    fileText = await response.text();
    console.log(fileText); // 正常输出内容
    // 后续直接使用fileText即可
}

// 调用函数
getFileContent();

async/await是Promise的语法糖，本质和then回调逻辑一致，但写法更直观，适合处理复杂的异步流程。

内容的提问来源于stack exchange，提问作者Amin Sanei