javascript - 等待函数结束

Question

我正在尝试从 firebase 获取一个集合，然后调用一个将插入数据的函数。问题是在比较函数结束之前调用了插入数据...

这是我正在遵循的指南:

1 - 获取游戏输入并创建一个包含要推荐的视频的数组

2 - 获取用户已经推荐的视频

3 - 将视频与数组进行比较以排除重复项。

4 - 继续执行下一个函数，将数组插入到 firebase。

问题是对于第 4 步，我需要完成第 3 步。但这并没有发生。关于如何解决这个问题的任何建议？

export const generateRecommendationsFromGame = (participantID) => {
  var newRec = [];
  let userRef = firebase.firestore().collection("users").doc(participantID);


  //1 Game inputs
  return firebase.firestore().collection("inputGame").where("user", "==", userRef).onSnapshot({}, function(querySnapshot) {
    querySnapshot.forEach(function(doc) {
      let consagua = doc.data().consagua;
      let enfart = doc.data().enfartamento;
      let mastig = doc.data().mastigacao;
      let mexdorm = doc.data().mexerdormir;
      let emoc = doc.data().emocoes;

      //13
      //V2.3.2
      if (Number(consagua) >= 3) {
        newRec.push('V2.3.2');
      }
      //15
      //V3.1
      if (Number(enfart) >= 25) {
        newRec.push('V3.1');
      }
      //16
      //V3.2
      if (Number(mastig) >= 40) {
        newRec.push('V3.2');
      }
      //17
      //V3.3
      //18
      //V3.4
      if (Number(mexdorm) >= 3) {
        newRec.push('V3.3');
        newRec.push('V3.4');
      }
      //19
      //V3.5
      if (Number(emoc) >= 2) {
        newRec.push('V3.5');
      }


      //2 - User Videos
      return firebase.firestore().collection("recommendedVideo").where("user", "==", userRef).get().then(result2 => {
        result2.forEach(doc2 => {

          //3 - Get video ref to compate to Array
          var videoFef = doc2.data().video.id;
          firebase.firestore().collection("videos").doc(videoFef).get().then(
            function(doc2) {
              if (doc2.exists) {
                var sequence = doc2.data().sequenceNumberID;
                for (var i = 0; i < newRec.length; i++) {
                  if (String(sequence) == String(newRec[i])) {
                    var index = newRec.indexOf(newRec[i]);
                    if (index > -1) {
                      newRec.splice(index, 1);
                    }
                  }
                }
              } else alert("Não existe doc videos");
            }
          )
        });
      }).then(() => {
         insertData(newRec);
      })
    });
  })
};

然后，在比较视频并排除重复视频后，我想调用一个函数将视频插入到 Firebase 上。

export const insertData= (arr) => {   
  var newRec = arr.split(',');
  for (var i = 0; i < newRec.length; i++) {
    var ref = newRec[i];
    firebase.firestore().collection("videos").where("sequenceNumberID", "==", ref.toString()).onSnapshot(function (querySnapshot) {
      querySnapshot.forEach(function (doc) {
        firebase.firestore().collection("recommendedVideo").add({
          seen: false,
          user: firebase.firestore().collection('users').doc(participantID),
          video: firebase.firestore().collection('videos').doc(doc.id)
        }).catch(function (error) {
          alert(error);
        })
      });
    });
  }
}

Answer 1

您需要对每个 doc2 进行异步查询，然后在完成所有查询后继续执行 insertData。正确的工具是 Promise.all，它接受一个 promises 数组，并在数组中的所有 promises 都被解析后解析。因此，将每个 doc2 映射到一个 Promise。

除了 Promise.all 之外，还可以使用 async/await 来大大减少缩进。

请注意，您正在隐藏(复制)forEach 中的 doc2 变量，这很容易造成混淆 - 最好将其命名为其他名称(例如 doc3):

使 querySnapshot.forEach 异步:

querySnapshot.forEach(async (doc) => {

然后:

//2 - User Videos
const result2 = await firebase.firestore().collection("recommendedVideo").where("user", "==", userRef).get();
await Promise.all(result2.map(async (doc2) => {
  //3 - Get video ref to compate to Array
  const videoFef = doc2.data().video.id;
  const doc3 = await firebase.firestore().collection("videos").doc(videoFef).get();
  if (!doc3.exists) {
    alert("Não existe doc videos");
    return;
  }
  var sequence = doc3.data().sequenceNumberID;
  for (var i = 0; i < newRec.length; i++) {
    if (String(sequence) !== String(newRec[i])) return;
    var index = newRec.indexOf(newRec[i]);
    if (index > -1) newRec.splice(index, 1);
  }
}));
// end of Promise.all
insertData(newRec);