Javascript 如何仅在异步循环执行完成后执行某些语句

如何仅在forEach函数中执行所有异步调用后运行函数FinalExecution

  doit=()=>{
          cart.forEach(async(i)=>{
              
              await axios.get(`localhost.........`})
              .then(({data})=>{
                   this.setState({data})})
              .catch(()=>{
                    this.setState({error:true})});
           })
           this.finalExecution();
        }
     
  finalExecution=()=>{
       .......
       .......
  }

---

您可以使用

Promise.all

，这样您就可以确保您的请求是正确的，例如：

doit = async () => {
  const responses = await Promise.all(
    cart.map(async (endpoint) => await axios.get('url'))
  );

  this.finalExecution(responses);
}

finalExecution = async (responses) => {
  const [response1, response2] = await responses; // here you will have an array with resolved promises
  this.setState(response1.data);
}

---

对循环使用

或
Promise.all（）

for循环：
cart=[1,2,3]
班猫{
构造函数（）{
this.setState=（参数）=>{
//console.log（参数）
}
}
doit=async（）=>{
用于（运输车的常数i）{
等待axios(`https://jsonplaceholder.typicode.com/todos/${i}`）
。然后（{data}）=>{
this.setState（{data}）
})
.catch（（）=>{
this.setState（{error:true}）
})
.然后（（）=>{
log（`finishfetching${i}`）
document.body.insertAdjacentHTML（'beforeend'，'finish fetching${i}`）
})
}
这是finalExecution（）
}
最终执行=（）=>{
console.log（'finalExecution'完成）
document.body.insertAdjacentHTML（'beforeend'，'finalExecution`）
}
}
catA=新猫（）
catA.doit（）

答应我
cart=[1,2,3]
班猫{
构造函数（）{
this.setState=（参数）=>{
//console.log（参数）
}
}
doit=（）=>{
const results=cart.map（异步（i）=>{
等待axios(`https://jsonplaceholder.typicode.com/todos/${i}`）
。然后（{data}）=>{
this.setState（{data}）
})
.catch（（）=>{
this.setState（{error:true}）
})
.然后（（）=>{
log（`finishfetching${i}`）
document.body.insertAdjacentHTML（'beforeend'，'finish fetching${i}`）
})
})
承诺。全部（结果）。最后（（）=>{
这是finalExecution（）；
})
}
最终执行=（）=>{
console.log（'finalExecution'完成）
document.body.insertAdjacentHTML（'beforeend'，'finalExecution`）
}
}
catA=新猫（）
catA.doit（）
这是否回答了您的问题？
cart = [1, 2, 3]

class Cat {

  constructor() {
    this.setState = (param) => {
      // console.log(param)
    }
  }

  doit = async () => {
    for (const i of cart) {
      await axios.get(`https://jsonplaceholder.typicode.com/todos/${i}`)
        .then(({ data }) => {
          this.setState({ data })
        })
        .catch(() => {
          this.setState({ error: true })
        })
        .then(() => {
          console.log(`finish fetching ${i}`)
          document.body.insertAdjacentHTML('beforeend', `<div>finish fetching ${i}</div>`)
        })
    }

    this.finalExecution()
  }

  finalExecution = () => {
    console.log('finish finalExecution')
    document.body.insertAdjacentHTML('beforeend', `<div>finish finalExecution</div>`)
  }
}

catA = new Cat()

catA.doit()

cart = [1, 2, 3]

class Cat {

  constructor() {
    this.setState = (param) => {
      // console.log(param)
    }
  }

  doit = () => {
    const results = cart.map(async (i) => {
      await axios.get(`https://jsonplaceholder.typicode.com/todos/${i}`)
        .then(({ data }) => {
          this.setState({ data })
        })
        .catch(() => {
          this.setState({ error: true })
        })
        .then(() => {
          console.log(`finish fetching ${i}`)
          document.body.insertAdjacentHTML('beforeend', `<div>finish fetching ${i}</div>`)
        })
    })

    Promise.all(results).finally(() => {
      this.finalExecution();
    })
  }

  finalExecution = () => {
    console.log('finish finalExecution')
    document.body.insertAdjacentHTML('beforeend', `<div>finish finalExecution</div>`)
  }
}

catA = new Cat()

catA.doit()