数组长度为0，即使它具有值

Question

我查询了一个firebase数据库并得到了结果，我将其推入一个数组，因为我需要删除重复的结果。 一切似乎都有效，但我得到的长度是0，即使数据存在。

let interests = [
  '-KpUpVi7-2W_JmR16HuC',
  '-KpUpYwC_FRulbXZnULK',
  '-Kpd3J9gNECwWSG6xAvt',
  '-KpUpbP3AGKs28McNrBh'
]
let finalArray = [];
interests.forEach((interest) => {
  this.hangoutsService.getInterestUsers(interest)
  .subscribe(
    (res) => {
      //console.log('the results: ', res)
      res.forEach((uid) => {
        //console.log(uid)
        finalArray.push(uid)
      })

    }
  )
})
console.log('final array: ',finalArray)
console.log('final array length: ',finalArray.length)

这是它调用的方法：

  getInterestUsers(interest){
  return this.db.object(`usersPerInterest/${interest}`)
    .map((r) => {
        return Object.keys(r)
    })
}

我附上了控制台的屏幕截图：

我在这里缺少什么？

Answer 1

您正在使用回调。但是在从回调获得响应之前打印数组。

let interests = [
  '-KpUpVi7-2W_JmR16HuC',
  '-KpUpYwC_FRulbXZnULK',
  '-Kpd3J9gNECwWSG6xAvt',
  '-KpUpbP3AGKs28McNrBh'
]
let finalArray = [];
interests.forEach((interest) => {
  this.hangoutsService.getInterestUsers(interest)
  .subscribe(
    (res) => {
      //console.log('the results: ', res)
      res.forEach((uid) => {
        //console.log(uid)
        finalArray.push(uid)
      })
    console.log('final array: ',finalArray)
    console.log('final array length: ',finalArray.length)
    }
  )
})

但是，要以更好的方式做到这一点，请使用promises。

Answer 2

您可以在异步回调函数之外立即记录数组长度。控制台日志执行时，回调函数尚未完成。

console.log('final array: ',finalArray)
console.log('final array length: ',finalArray.length)

这就是它获得一个空数组的原因。您无法通过这种方式获得异步函数的正确结果，您可以将控制台日志放在异步函数中。

let finalArray = [];
interests.forEach((interest) => {
  this.hangoutsService.getInterestUsers(interest)
  .subscribe(
    (res) => {
      //console.log('the results: ', res)
      res.forEach((uid) => {
        //console.log(uid)
        finalArray.push(uid)
      })
        console.log('final array: ',finalArray)
       console.log('final array length: ',finalArray.length)
    }
  )
})