使用fetch()获取txt文件时运行报错的原因咨询

• 变量作用域错误
  你在then的回调函数内部用var message = t声明变量，var声明的变量存在函数作用域限制，只能在当前回调函数内部访问，全局作用域下的console.log(message)找不到该变量，直接触发变量未定义的报错。
• 异步执行时序错误
  fetch是异步网络请求API，调用后不会阻塞后续代码执行，console.log(message)会在请求还没完成、还没给message赋值的时候就运行，哪怕你把message声明到全局作用域，这时候打印也会拿到undefined的结果。

推荐用async/await写法，逻辑更直观：

// 全局变量存储请求结果
let message = null
const fileUrl = 'https://pastebin.pl/view/raw/2facc037'

async function getFileContent() {
  const response = await fetch(fileUrl)
  message = await response.text()
  // 所有需要用到message的逻辑都要在请求完成后调用
  console.log(message)
}

getFileContent()

如果偏好Promise链式写法，可以参考以下代码：

let message = null
const fileUrl = 'https://pastebin.pl/view/raw/2facc037'

fetch(fileUrl)
  .then(r => r.text())
  .then(t => {
    message = t
    // 后续使用message的逻辑放在这里执行
    console.log(message)
  })

注意：不要尝试在请求完成前的同步代码里访问message，异步请求的结果只能保证在回调/await之后能拿到有效值

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