Js之事件循环（执行机制）

js的执行机制是事件循环

 

什么是事件循环？

js引擎在执行代码时，首先会将同步代码加入到主线程中，异步代码会放到event table中注册回调函数，

当主线程空闲之后，event table中的回调函数就会被加入到主线程中执行。

当遇到宏任务（例如：script、setTimeout、setInterval等）又有微任务（promise、promise.nextTick）时，首先遇到异步代码其回调被加入到event table中，遇到同步代码直接执行，遇到微任务如promise中的.then会将其加入到微任务的队列中，当前这个宏任务执行完成，就会去执行微任务，微任务执行完成，也就是完成了一个tick；就会进入到执行下一个tick，又从宏任务到微任务开始执行，这样循环就是事件循环。

 

案例：

要知道node和浏览器的event loop有差异，这里以浏览器为准

console.log('1');

setTimeout(function() {
    console.log('2');
    process.nextTick(function() {
        console.log('3');
    })
    new Promise(function(resolve) {
        console.log('4');
        resolve();
    }).then(function() {
        console.log('5')
    })
})
process.nextTick(function() {
    console.log('6');
})
new Promise(function(resolve) {
    console.log('7');
    resolve();
}).then(function() {
    console.log('8')
})

setTimeout(function() {
    console.log('9');
    process.nextTick(function() {
        console.log('10');
    })
    new Promise(function(resolve) {
        console.log('11');
        resolve();
    }).then(function() {
        console.log('12')
    })
})

　　

 

 

参考资料：

 js运行机制：https://segmentfault.com/a/1190000012806637

 js运行机制深入浅出：https://zhuanlan.zhihu.com/p/33125763