zoukankan      html  css  js  c++  java
  • 6.Javascript如何处理循环的异步操作

    前沿:参考ES6语法的async/await的处理机制

    先上一段代码

     1 function getMoney(){
     2     var money=[100,200,300]  
     3     for( let i=0; i<money.length; i++){
     4         compute.exec().then(()=>{
     5             console.log(money[i])
     6             //alert(i)
     7         })
     8     }
     9 }
    10 //compute.exec()这是个异步方法,在里面处理一些实际业务
    11 //这时候打印出来的很可能就是300,300,300(因为异步for循环还没有等异步操作返回Promise对象过来i值已经改变)

    正确处理思路

     1 async function getMoney(){
     2     var money=[100,200,300]  
     3     for( let i=0; i<money.length; i++){
     4         await compute.exec().then(()=>{
     5             console.log(money[i])
     6             //alert(i)
     7         })
     8     }
     9 }
    10 //关键字async/await  async告诉getMoney方法里面存在异步的操作,await放在具体异步操作(方法)前面,意思是等待该异步返回Promise才会继续后面的操作

    另外还有一种递归的处理思路

     1 function getMoney(i) {
     2   var money=[100,200,300]
     3   compute.exec().then(() => {
     4     if ( i < money.length ) {  
     5       console.log(money[i]);
     6       i++;
     7         getMoney(i);
     8       }
     9    });
    10 }
    11 getMoney(0);//开始调用
    12 //用递归来实现自我循环(具体循环在then里面,可以确保前面的compute.exec()的异步操作完成).then()是返回了Promise对象为resolve后才进行的(可以了解一下Promise对象)

    转:https://www.cnblogs.com/xiujun/p/10637037.html

  • 相关阅读:
    PHP 文件上传七牛云
    Ubuntu Nginx 配置
    Ubuntu Sublime 配置
    Ubuntu Apache 域名配置
    Ubuntu Apache 配置
    LAMP 搭建
    vue函数防抖和节流
    vs code 同步
    常用软件
    vue
  • 原文地址:https://www.cnblogs.com/xiaole9924/p/11841629.html
Copyright © 2011-2022 走看看