美文网首页
前端进阶|第四天从setTimeout、Promise看js 的

前端进阶|第四天从setTimeout、Promise看js 的

作者: 皮卡球ca | 来源:发表于2019-10-17 16:17 被阅读0次

    要理解这几个函数的执行顺序,需要先明确js的执行机制。
    Javascript是单线程语言,事件的调度机制是事件循环(event loop)

    console.log(1); 
    setTimeout(function () {
        console.log(2)
    }, 0);
     console.log(3); 
    

    执行结果是1,3,2
    注意 setTimeout的事件间隔为0,应该立即执行的,但还是在3之后,为什么会这样呢?
    这是因为他们处于不同的队列中。我们知道js请求是分为同步和异步两类,其中异步任务的调度又分为两类,分别是宏任务和微任务。

    macro-task(宏任务): setTimeout,setImmediate,MessageChannel
    micro-task(微任务): 原生Promise(有些实现的promise将then方法放到了宏任务中),MutationObserver

    setTimeout(function(){
         console.log('定时器开始')
     });
     
     new Promise(function(resolve){
         console.log('马上执行for循环');
         for(var i = 0; i < 10000; i++){
             i == 99 && resolve();
         }
     }).then(function(){
         console.log('执行then函数')
     });
     
     console.log('代码执行结束');
    
    

    执行结果
    js0905.html:16 马上执行for循环
    js0905.html:24 代码执行结束
    js0905.html:21 执行then函数
    js0905.html:12 定时器开始

    js的执行调度机制,没有太看懂,决定分两天。

    相关文章

      网友评论

          本文标题:前端进阶|第四天从setTimeout、Promise看js 的

          本文链接:https://www.haomeiwen.com/subject/zwsjyctx.html