等待多个承诺并从 Firebase 获取一些值

Question

我希望这个问题不是重复的，但我是这么认为的。我在发布之前进行了研究，但我找到的答案对我没有帮助。

我正在使用 Firebase 在键 myKey 中保存字符串内容，因此结构类似于：

{ myKey: {
    key1: an object stringified,
    key2: an object stringified,
    key2: an object stringified,
    ...

  }
}

这是我的代码：

async fetchContent(documentId, sheetId) {
    const json = await this.fetchSheetContent(documentId, sheetId, 'A:B')

    const content = json.map(async (row) => {
        const stringifiedContent = await readValue(new URL(row.URL).search) // obtain `an object stringified`
        const parsedContent = JSON.parse(stringifiedContent)
        return { row, parsedContent }
      }
    )

    console.log(content) // <-- content is a pending Promise, I want instead an array of objects
    
    // do something with the array of objects
    // return content.map(c => {...) 
}

async function readValue(search) {
  const queryParams = new URLSearchParams(search)
  const key = queryParams.get('myKey')
  if (!key) return
  const stringifiedState = await createSyncContent(STATE_KEY).get(key)
  return stringifiedContent
}

const createSyncContent = (db) => {
  const ref = fbDb.database().ref(db)

  const syncContent = {
    get: async (key) => {
      try {
        const snapshot = await ref.child(key).get()
        if (snapshot.exists()) {
          const value = snapshot.val()['myKey']
          return value
        } else {
          console.log('ERROR')
        }
      } catch (error) {
        console.error(error)
      }
    },
  }
  return syncContent
}

在该代码中 content 是一个未决的 Promise，我想要一个对象数组。哪里出错了？

非常感谢，我是 Promises 的初学者。

我试过了Promise.all:

async fetchContent(documentId, sheetId) {
    const json = await this.fetchSheetContent(documentId, sheetId, 'A:B')

    const content = Promise.all(json.map(async (row) => {
        const stringifiedContent = await readValue(new URL(row.URL).search)
        const parsedContent = JSON.parse(stringifiedContent)
        return { row, parsedContent }
      }
    ))
    
    // do something with the array of objects
    // return content.map(c => {...)
}

和：

async fetchContent(documentId, sheetId) {
    const json = await this.fetchSheetContent(documentId, sheetId, 'A:B')

    const content = await json.map(async (row) => {
        const stringifiedContent = await readValue(new URL(row.URL).search)
        const parsedContent = JSON.parse(stringifiedContent)
        return { row, parsedContent }
      }
    )
    
    // do something with the array of objects
    // return content.map(c => {...)
}

好像不行

Answer 1

你想念await。试试这个：

const content = await json.map(async (row) => {...})
console.log(content)

Answer 2

据我了解 JS，当你在函数前使用 async 时，函数的 return 类型会变为 promise。

有什么问题：

    const content = json.map(async (row) => {
        const stringifiedContent = await readValue(new URL(row.URL).search) // obtain `an object stringified`
        const parsedContent = JSON.parse(stringifiedContent)
        return { row, parsedContent }
      }
    )

此处您在地图回调函数之前使用异步，因此您在内容中看到的地图 returns 未决承诺数组。

解法（可以多）：

您可以使用 Promise.all 并行运行多个 api 请求并等待所有请求都得到解决。

缺点：如果任何承诺未能解决，它将失败。

解决方法：

供参考：Promise.all

我没有测试上面的答案。您也可以尝试一下，因为它简短易行。

等待多个承诺并从 Firebase 获取一些值

Await multiple promises and getting some values from Firebase

javascript

es6-promise