js代码实现异步同步化

最新推荐文章于 2024-12-11 20:37:53 发布

原创最新推荐文章于 2024-12-11 20:37:53 发布 · 1.1k 阅读

0 ·

CC 4.0 BY-SA版权

本文探讨了在JavaScript中如何将异步代码调整为在同步代码前执行的方法。通过将回调函数作为参数传递并调用，实现了按指定顺序执行异步和同步任务，确保了即使在异步操作如setTimeout中，也能控制执行流程。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

我们知道在js中同步代码永远要比异步代码先执行，那么如何实现异步在同步之前执行呢？来吧~看代码
正常情况下

      let arr = [
        ()=>{
            console.log(1)
            
        },
        ()=>{
            console.log(2)
           
        
        },
        ()=>{
            setTimeout(()=>{
                console.log(3)
              
            },3000)
        },
        ()=>{            
            console.log(4)
         }       
    ]
    function zhixing (arr){
       arr.filter((item)=>{
           item() // 1 2 4 3
       })
    }
    zhixing(arr)

经过改变后：

    let arr = [
        (next)=>{
            console.log(1)
            next()
        },
        (next)=>{
            console.log(2)
            next()
        
        },
        (next)=>{
            setTimeout(()=>{
                console.log(3)
                next()
            },3000)
        },
        (next)=>{            
            console.log(4)
         }       
    ]
    function zhixing (arr){
         let index = 0;
         let next = ()=>{
             index++;
             if(index>arr.length-1){
                 return
             }
             arr[index](next)
         }
      arr[0](next)
    }
    zhixing(arr) //最后会按顺序，打印出1,2，（3s之后打印）3,4