如何使数组过滤器工作与异步函数端？[重复]

Question

我正在开发一个小型纸牌游戏网页应用程序。我正在使用一个“房间”系统来容纳每个游戏及其玩家。每个房间都有一个玩家列表，我需要过滤这个列表，以便只获得在Firebase实时数据库中有值的玩家列表。在本例中，我将在/state/{userId}中检查它们的用户存在。

我原以为我可以很简单地将其拼凑在一起，但是过滤后的players数组，或者activePlayers，在过滤完成之前就被读取了。

用forEach演示：

function debugActivePlayers (players) {
  activePlayers = []
  players.forEach(player => {
   firebase.ref('/status/' + player)
     .once('value')
     .then(snapshot => {
       console.log(snapshot.val()) // 'offline' or 'online' accordingly
       if (snapshot.val() === 'online') activePlayers.push(player)
       return null // <-- IDE throws a fit otherwise lol
     })
  })
  console.log(activePlayers)
}

我期望发生的是：

offline
online
online
[userId1, userId2, userId3]

但真正发生的是：

[]
offline
online
online

我如何确保players.forEach（或players.filter）同步运行，即使内部有异步/promise逻辑（firebase查询）？

Answer 1

尝试使用下面的“异步/等待”。这将等待所有异步调用完成，然后前进到最后一个console.log

async function debugActivePlayers (players) {
  let activePlayers = []

  for (let player of players) {
    let snapshot = await firebase.ref('/status/' + player).once('value')
    console.log(snapshot.val()) // 'offline' or 'online' accordingly
    if (snapshot.val() === 'online') activePlayers.push(player)
    return null // <-- IDE throws a fit otherwise lol
  }

  console.log(activePlayers)
}

解释-"for... of"with"wait使得剩余语句的执行被搁置，直到所有promise都得到解决...为了证明这一点，请在下面进行测试

function getValue(p) { return Promise.resolve(p) } 

async function test (players = [1,2,3]) {

  for (let player of players) {
    console.log(await getValue(player))
  }

  console.log('done')
}

test()