Question

下面的JavaScript返回一个奇怪的数组版本。下面的forEach不会记录任何内容。我可能在这里遗漏了一些非常基本的东西，但是我知道一个事实，即数组已被填充...除非直到后来由于异步而没有被填充，Chrome才在事实之后评估console.log？

let damageRollStringArr = []

monster.damage_types.forEach(async (damageTypeName) => {
    const damageType = await checkResponseAndReturnValue(await DamageTypesService.findDamageType(damageTypeName.trim()))

    if (damageType !== null) {
        damageRollStringArr.push(damageType.damage)
    }
})

damageRollStringArr.forEach(el => console.log(el))

// Was returning an empty array[] with objects inside?
return damageRollStringArr

谢谢

Answer 1

demageRollStringArr.forEach（第二个foreach）不会等待monster.demage_types.forEach（第一个foreach）执行，尽管第一个forEach中有一个异步等待状态

要实现您想做的事，请尝试此

let damageRollStringArr = []
const promises = monster.damage_types.map(async (damageTypeName) => {
    const damageType = await checkResponseAndReturnValue(await DamageTypesService.findDamageType(damageTypeName.trim()))
    if (damageType !== null) {
        damageRollStringArr.push(damageType.damage)
    }
})
await Promise.all(promises)
damageRollStringArr.forEach(el => console.log(el))
return damageRollStringArr

或者，您可以使用普通的for（）循环替换第一个foreach

let damageRollStringArr = []
for(let i = 0; i < monster.demage_types.length; i++) {
    const damageType = await checkResponseAndReturnValue(await DamageTypesService.findDamageType(damageTypeName.trim()))
    if (damageType !== null) {
        damageRollStringArr.push(damageType.damage)
    }
}
damageRollStringArr.forEach(el => console.log(el))
return damageRollStringArr

第一个解决方案将并行运行循环，
第二种解决方案将按顺序运行循环

在forEach循环中异步/等待

1 个答案: