zoukankan      html  css  js  c++  java
  • js执行机制

    1.     关于javascript

    js是一门单线程语言,一切js版的‘多线程’都是用单线程模拟起来的。

    2.     js事件循环

    将任务分为2类:同步任务、异步任务

    同步任务进入主线程,异步任务进入Event Table并注册函数

    当指定的事件完成时,Event Table会将这个函数移入Event Queue

    主线程内的任务执行完毕为空后,会去Event Queue读取对应的函数,进入主线程运行

    以上过程会不断的重复,即Event Loop事件循环

    js引擎存在monitoring process进程,会持续不断的检查主线程执行栈是否为空

     

    ajax进入Event Table,注册回调函数success

    执行console.log(‘代码执行结束’)

    ajax事件完成后,回调函数success进入event Queue

    主线程从Event Queue读取回调函数success并执行

    3.     setTimeout  异步任务

    task()进入Event Table并注册,计时开始

    执行sleep()

    3秒到了,计时事件完成,task()进入Event Queue,此时sleep()仍在执行

    sleep()执行完毕

    task()从Event Queue进入主线程并执行

     

    setTimeout(fn,0)的含义是,指定某个任务在主线程最早可得的空闲执行,不用再等多少秒,只要主线程执行栈内的同步任务全部执行完就可以马上执行

    4.     setInterval

    setInterval会每隔指定时间将注册的函数置入Event Queue

    setInterval(fn,ms)不是每过ms秒就执行一次fn,而是每过ms秒,就会有fn进入Event Queue

    一旦setInterval的回调函数fn执行时间超过了延迟时间ms,那么就完全看不出来有时间间隔了

    5.     Promise与process.nextTick(callback)

    宏任务 整体代码script setTimeout setInterval

    微任务 Promise process.nextTick

    不同类型的任务会进入不同的Event Queue

     

     

    先遇到setTimeout,将其回调函数注册后分发到宏任务Event Queue

    接下来遇到Promise,new Promise立即执行,then函数分发到微任务Event Queue

    遇到console.log(‘console’)立即执行

    第一次宏任务执行结束,查看微任务,发现了then,执行

    第一轮事件循环结束,开始下一轮

    第二轮,发现了宏任务Event Queue中的setTimeout立即执行

    结束

    6.     复杂的例子

    第一轮事件循环Event Loop

    console.log(‘1’);

    遇到setTimeout,将其回调函数分发到宏任务Event Queue中,记为setTimeout1

    遇到process.nextTick(),其回调函数被分发到微任务Event Queue中,记为process1

    遇到Promise,输出7,then被分发到微任务Event Queue,记为then1

    又遇到setTimeout,其回调函数被分发到宏任务Event Queue中,记为setTimeout2

    第一轮宏任务执行结束,开始执行微任务,输出6和8

    第一轮事件循环输出1 7 6 8

    第二轮事件循环Event Loop

    宏任务setTimeout1:

            首先输出2

            将process.nextTick()分发到微任务EventQueue,记为process2

            new Promise立即执行,输出4

            then分发到微任务Event Queue,记为then2

    第二轮宏任务执行完毕,开始执行微任务,输出3和5

    第二轮事件结束,输出2 4 3 5

    第三轮事件循环Event Loop

    宏任务setTimeout2:

            输出9

            将process.nextTick()分发到微任务EventQueue,记为process3

           then分发到微任务Event Queue,记为then3

    第三轮宏任务执行完毕,开始执行微任务,输出10和12

    第三轮事件结束,输出9 10 12

    7.     总结

    js是一门单线程语言

    Event Loop是js的执行机制

  • 相关阅读:
    监控 | open-falcon | 安装
    日语 | 日本50音
    PXE | 开关机
    linux | 网卡驱动
    Linux——Centos 7 chmod命令
    Linux——Centos 7 ls命令
    Linux——Centos 7 passwd命令
    Linux——Centos 7 账户管理命令(用户组篇)groupadd groupmod groupdel
    Linux——Centos 7 账户管理命令(用户篇)useradd usermod userdel
    Linux——Centos 7 diff命令
  • 原文地址:https://www.cnblogs.com/cdx0/p/eventLoop.html
Copyright © 2011-2022 走看看