循環的Javascript異步行為

Question

我使用async / await異步獲取數據，然后依次運行兩個for循環。 所以我的問題是，由於js是異步的，因此對於大數據集，for循環會彼此重疊嗎？如果是，該如何解決呢？ 哪些條件循環可以重疊？

實際上，我正在嘗試制作下拉列表及其功能，但我對此表示懷疑。

const createDropdown = async language => {
    let i = 0;
    let listPromise = new Promise((resolve, reject) => {
        db.ref("Products/" + language).on('value', snapshot => {
            resolve(snapshot.val())
        })//Fetching Data
    })

    let list = await listPromise;

    for(i in list)
        dropdown.remove(0)

    for(i in list)
        dropdown.options[dropdown.options.length] = new Option(list[i].name, list[i].name)
}

我正在運行此代碼，並且for循環不會重疊，但是有條件嗎？

Answer 1

在代碼中一個接一個地循環的循環永遠不會與循環內的代碼同步或異步重疊。

for (var i = 0; i < 10; i++) {
    doSomethingSync()
}



for (var j = 0; j < 10; j++) {
    createPromise().then((res) => {console.log(res))
}


for (var k = 0; k < 10; k++) {
    var res = await createPromise();
    console.log(res);
}

在上面，“ I”循環完成其所有操作，然后完成“ J”循環，然后完成“ K”循環。

這是每個操作的順序和詳細信息

1. “ I”循環將10個同步操作序列化。
2. “ J”循環創建10個不同的承諾。 他們可能以不同的順序解決。
3. “ K”循環創建10個序列化的Promise。 每次迭代都等待，直到承諾被解決，然后再求凈。

1、2和3總是一個接一個地發生。

Answer 2

我使用此解決方案與axios一起使用，對服務器的請求約為1000個，並且工作正常，也許這也可以是您的解決方案。 在此代碼中，您將對db.ref作出承諾，並等待響應，然后使用該響應進行操作。

const createDropdown = async (language) => {
  const listPromise = await Promise.all(
    return await db.ref("Products/" + language).on ('value', snapshot => snapshot.val())
  )

  for(i in listPromise)
        dropdown.remove(0)

  for(i in listPromise)
        dropdown.options[dropdown.options.length] = new Option(list[i].name, list[i].name)
}