javascript - 意外的保留字 'await'

Question

我正在开发一个 react native 应用程序。

我有一个 forEach 迭代，其中我使用await 等待结果，但我不断收到错误:“意外的保留字‘await’”。我不明白为什么？

const removeData = async () => {
    try {
      dataArray.forEach((data) => {
        // What is wrong with my 'await' usage here??? It is a async API
        const deletedData = await API.graphql({ query: deleteData, variables: { input: data } });
       
      })
    } catch (err) {
      console.log('error deleting data:', err)
    }
  }

Answer 1

因为它所在的函数不是一个async函数，所以它是一个非async函数(对forEach的回调)。 await 必须直接位于async 函数内，而非位于async 函数内的同步函数内。

如果你想在那里使用await，请使用for-of:

const removeData = async () => {
    try {
        // Does the deletions in series (one after the other)
        for (const data of dataArray) {
            const deletedData = await API.graphql({ query: deleteData, variables: { input: data } });
            // ...presumably use `deletedData` here...
        }
    } catch (err) {
        console.log("error deleting data:", err);
    }
};

这样，await 就位于 async 函数中。

上面的内容按系列进行了删除(一个接一个)，在我看来这就是你想要的。但为了以防万一，您可以使用 map 和 Promise.all 并行执行操作:

const removeData = async () => {
    try {
        // Does the deletions in parallel (all running together)
        const deletedDataArray = await Promise.all(dataArray.map(
            data => API.graphql({ query: deleteData, variables: { input: data } })
        ));
        // ...presumably use `deletedDataArray` here...
    } catch (err) {
        console.log("error deleting data:", err);
    }
};

---

¹ 或者在模块的顶层，在支持顶层 await 的环境中。