zoukankan      html  css  js  c++  java
  • 事件循环(Event Loop)

    1.什么是事件循环?

    JavaScript为单线程执行的,所以是从上到下依次执行,js分为两个任务,宏任务和微任务

    首先执行宏任务(第一次就是执行所有的同步代码),再执行所有的微任务,执行完毕之后再次执行

    宏任务,执行完毕再次执行所有的微任务,也就是:

    宏任务 --> 微任务  -->  宏任务 -->  微任务

    2.什么是宏任务,微任务?

    宏任务:

    script(全局任务), setTimeout, setInterval, setImmediate, I/O, UI rendering.
    微任务:
    process.nextTick, Promise.then, Object.observer, MutationObserver.

    3.案例深入解读

     setTimeout(function(){
        console.log(1)
     },0)
    
     new Promise((resolve,reject)=>{
         console.log(2)
         resolve(3)
         setTimeout(function(){
            console.log(5)
            promise.resolve
         },0)
     }).then((val)=>{
         console.log(val)
    }) console.log(4)

    解读:

        首先执行宏任务(同步代码)  :console.log(2)  console.log(4)

        再执行所有的微任务  console.log(3)

        再一次从上到下执行所有的微任务:console.log(1)   console.log(5)

        所以正确答案是  2 4  3 1 5

    我们再加大难度

    console.log('start')
    setTimeout(() => {
      console.log('setTimeout 1')
      Promise.resolve().then(() => {
        console.log('promise 3')
      }).then(() => {
        console.log('promise 4')
      }).then(() => {
        setTimeout(() => {
          console.log('setTimeout 2')
          Promise.resolve().then(() => {
            console.log('promise 5')
          }).then(() => {
            console.log('promise 6')
          })
        }, 0)
      })
    }, 0)
    Promise.resolve().then(() => {
      console.log('promise 1')
    }).then(() => {
      console.log('promise 2')
    })

    解读:

        我们先执行同步代码: start

        微任务:promise 1 ,  promise 2

        宏任务: setTimeout 1

       微任务:promise 3, promise 4

       宏任务:setTimeout 2 , 

      微任务:promise 5,promise 6

    正确答案

    start promise 1 promise 2 setTimeout 1 promise 3 promise 4 setTimeout 2 promise 5 promise 6
  • 相关阅读:
    get和post区别
    linux查看是否被入侵
    (转)MSSQL 各个发行版本版本号以及Compact 版本号
    (转)玩转-数据库行列转换
    (转)理解SQL SERVER中的分区表
    (转)使用CruiseControl+SVN+ANT实现持续集成之三
    (转)使用CruiseControl+SVN+ANT实现持续集成之二
    (转)使用SVN+CruiseControl+ANT实现持续集成之一
    (转)持续化集成工具CruiseControl.NET
    (转)DockPanel 右键增加关闭,除此之外全部关闭的功能
  • 原文地址:https://www.cnblogs.com/guan-shan/p/10127853.html
Copyright © 2011-2022 走看看