如何在数组循环中强制执行承诺

Question

我正在尝试了解如何在给定的数组循环中实现 Promise 和 Promise.All 的基础知识，例如，从可以在循环中执行任意数量的操作的 firebase 查询中，然后我可以访问到后来的结果。我似乎无法获得正确的语法和逻辑。下面是一个示例方法，我想延迟将一些项目插入数组，然后在循环后访问数组进行处理。

我在 Stackoverflow 上研究了不同的方法。有些人分配了一个 promises = snap.forEach 循环，然后在完成后以某种方式解决这个问题。其他人正在循环内创建一个承诺。在下面的示例中，我只是使用 settimeout 来延迟/创建异步进程。

        testfirebaseData = () => {

        let channels =[];
        var promises=[];
         firebase.database().ref('challengeResponses').child(day).once('value', snap => {

          snap.forEach(channelChild => {

                promises.push(new Promise((resolve) => {
                    setTimeout(() => {
                    channels.push(channelChild.key);
                    resolve(channels)
                   },1000)
                })
                )

             })             
        }).then (() => {
         Promise.all(promises).then(() => {
            console.log(channels[0])
        })

       }


    }

我希望上面的输出显示“通道”数组中的第一个元素，但它总是以“未定义”返回......因为我显然没有正确处理承诺。我错过了什么？

Answer 1

这是使用您的代码样式的示例示例。我放的是数字而不是数组中的对象；

https://jsfiddle.net/th3vecmg/4/

 var promises = [];
 let channels =[];

 [1, 2, 3, 4, 5].forEach((elm, i) => {

   promises.push(new Promise((resolve) => {
     setTimeout(() => {
      channels.push(elm)
       resolve(elm);
     },  1000)
   }))

 });
 console.log(channels[0]) // gives undefined
 Promise.all(promises).then(() => {
   console.log(channels[0]) // gives 1
 })

您不应该在 then 中得到未定义，因为它正在等待执行承诺。如果您试图在 then 范围之外显示结果

，您只会得到未定义的结果

代码没有真正意义，因为您在 then 中显示一个全局变量，而不是依赖于 promise 的输出

如果你想延迟执行 1 然后在 setTimeout 的 timeArgument 中做一些乘法...

Answer 2

您的 new Promise(...) 应该包装 firebase 调用，因为那是异步操作。并且不在回调中。回调内部没有异步操作，只是普通数组推送，这是一个同步操作

var promise = new Promise((resolve)=>{
   firebase.database().ref('challengeResponses').child(day).once('value', snap => {
     var channels=[];
     snap.forEach(channelChild => {
       channels.push(channelChild.key);
     });
     resolve(channels);
   });
});

promise.then((channels)=>{
    console.log(channels);
});

如果您想延迟整个操作：

var promise = new Promise((resolve)=>{
   firebase.database().ref('challengeResponses').child(day).once('value', snap => {
     var channels=[];
     setTimeout(()=>{
       snap.forEach(channelChild => {
         channels.push(channelChild.key);
       });
       resolve(channels);
     },1000);
   });
});

要模拟嵌套的异步操作，您可以像以前一样将 Promise 添加到数组中，但在外部 Promise 中解析 Promises.all() 并在内部 Promise 中解析您的数据：

var promise = new Promise((resolve)=>{
   firebase.database().ref('challengeResponses').child(day).once('value', snap => {
      var snapPromises=[];
      snap.forEach(channelChild => {
         snapPromises.push(new Promise((snapresolve)=>{
           setTimeout(()=>{
             snapresolve(channelChild.key);
           },1000)
         });
      });
      resolve(Promise.all(snapPromises));         
   });
});