为什么 async await 在这个 function 中不起作用？

Question

这可能是一个初学者问题，但我无法弄清楚：

我正在执行异步数据库调用，其中我想从数据库中获取 object 并将此 object 分配给 window object (window.naamID)。

接下来我想运行一个 function，其中我使用分配给 window object（使其成为全局）的 object 并将其用作数据库查询（.where（“Vraagsteller”，“==”，naamID））。

当然，问题是第二个 function 在第一个 function 完成之前开始运行（因为它是异步的）。

我想通过将第二个 function 包装在同步 function 中并等待第一个 function 来克服这个问题。

这似乎不是工作。 控制台显示分配给 window object 的 object 未定义。

这是代码：

 function constructAuthMenu(){
auth.onAuthStateChanged(User =>{

    const userRef = db.collection("Vitaminders")
    .doc(User.uid);
    userRef.get()
    .then(function(doc) {

        const naamID = doc.data().Gebruikersnaam;
        const ID = doc.data().ID
        const naam = naamID.replace(ID, "")
        const profilePic = doc.data().Profielfoto

        window.naamID = naamID
     });
  });
}; 

constructAuthMenu()

 async function getNewReactions(){

        await constructAuthMenu()

      db.collectionGroup("Reactions")
      .where("Vraagsteller", "==", naamID)
      .where("New", "==", 
       "Yes").get().then(querySnapshot => {
        querySnapshot.forEach(doc => {

       *Do stuff*

   });
});

我究竟做错了什么？ 或者异步等待不是这样工作的吗？

Answer 1

如果constructMenuFunction实际上存在于您的代码中的其他地方，并返回 Promise，那么您的问题是您在 function 调用中缺少括号： await constructMenuFunction();

如果代码中的其他地方不存在constructMenuFunction ，并且异步 function 之前的第一个 function 实际上是您想要调用的，那么您的问题是第一个 function 不返回 Promise 并且您的异步 function 调用错误的方法并且没有父母。

async function constructAuthMenu() {
  return await auth.onAuthStateChanged(async User => {
    try {
      const userRef = db.collection("Vitaminders").doc(User.uid);
      const doc = await userRef.get();
      const naamID = doc.data().Gebruikersnaam;
      const ID = doc.data().ID;
      const naam = naamID.replace(ID, "");
      const profilePic = doc.data().Profielfoto;
      return naamID;
    } catch(err) {
      console.error(err);
    }
 });
};