码迷,mamicode.com
首页 > Web开发 > 详细

js事件循环

时间:2019-10-26 17:29:44      阅读:101      评论:0      收藏:0      [点我收藏+]

标签:style   table   settime   event   js代码   代码   out   不同   font   

javascript是一门单线程语言

事件循环(Event Loop)是js实现异步的一种方法,也是js的执行机制

 

同步任务和异步任务

  • 同步和异步任务分别进入不同的执行"场所",同步的进入主线程,异步的进入Event Table并注册函数。
  • 当指定的事情完成时,Event Table会将这个函数移入Event Queue。
  • 主线程内的任务执行完毕为空,会去Event Queue读取对应的函数,进入主线程执行。
  • 上述过程会不断重复,也就是常说的Event Loop(事件循环)。

 

macro-task(宏任务):包括整体代码script,setTimeout,setInterval

micro-task(微任务):Promise,process.nextTick

事件循环的顺序,决定js代码的执行顺序。进入整体代码(宏任务)后,开始第一次循环。接着执行所有的微任务。然后再次从宏任务开始,找到其中一个任务队列执行完毕,再执行所有的微任务。

 

 1 console.log(‘1‘);
 2 
 3 setTimeout(function() {
 4     console.log(‘2‘);
 5     process.nextTick(function() {
 6         console.log(‘3‘);
 7     })
 8     new Promise(function(resolve) {
 9         console.log(‘4‘);
10         resolve();
11     }).then(function() {
12         console.log(‘5‘)
13     })
14 })
15 process.nextTick(function() {
16     console.log(‘6‘);
17 })
18 new Promise(function(resolve) {
19     console.log(‘7‘);
20     resolve();
21 }).then(function() {
22     console.log(‘8‘)
23 })
24 
25 setTimeout(function() {
26     console.log(‘9‘);
27     process.nextTick(function() {
28         console.log(‘10‘);
29     })
30     new Promise(function(resolve) {
31         console.log(‘11‘);
32         resolve();
33     }).then(function() {
34         console.log(‘12‘)
35     })
36 })

输出结果:1,7,6,8,2,4,3,5,9,11,10,12

 

js事件循环

标签:style   table   settime   event   js代码   代码   out   不同   font   

原文地址:https://www.cnblogs.com/vicky24k/p/11743468.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!