API fetch函数中声明的Data变量无法使用问题求助

错误原因 #

1. 变量作用域限制：你在collectWorks函数内部用const声明的worksData是函数局部变量，只能在collectWorks函数内部访问，testfunction完全无法识别这个变量，所以会抛出ReferenceError。
2. 隐式全局的副作用：你说去掉const后能运行，是因为此时worksData变成了隐式全局变量——没有用const/let声明就直接赋值，JS会自动把它挂载到全局对象上。但这种写法极度不推荐，会造成全局变量污染，很容易引发意外的变量覆盖问题。

正确声明与写法 #

collectWorks是async函数，调用它会返回一个Promise，await collectWorks()会拿到它的返回值（也就是内部的worksData），你需要在testfunction内部主动接收这个返回值并声明变量：

async function collectWorks() {
    const response = await fetch("http://localhost:5876/api/works");
    const worksData = await response.json();
    return worksData;
}

async function testfunction() {
    // 在testfunction内部声明变量，接收collectWorks的返回值
    const worksData = await collectWorks();
    let test = worksData[1].title;
    console.log(test);
}
testfunction();

额外注意 #

• 永远用const/let声明变量，杜绝隐式全局的写法。
• async函数的返回值必须主动接收，否则无法获取其内部处理的数据。

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