js事件循环(event loop)

我们都知道,js是单线程的,虽然现在有 worker 的存在,但是也只是可以进行运算,并不能操作 dom

js最一开始执行的线程,是主线程,然后主线程执行完毕后,是微队列 microtask 的循环执行,微队列执行完毕后,在执行宏队列 macrotask,值得注意得是宏任务每执行一个都会去检查微任务或者主线队列有没有要执行的队列。

宏队列的方法:setTimeout 、setInterval 、setImmediate 、I/O 、UI rendering

微队列的方法:promise.thenprocess.nextTick 、Object.observe(已废弃)

下面是一个简单的例子

setTimeout(function() {
    console.log(1)
}, 0);
new Promise(function executor(resolve) {
    console.log(2);
    for( var i=0 ; i<10000 ; i++ ) {
        i == 9999 && resolve();
    }
    console.log(3);
}).then(function() {
    console.log(4);
});
console.log(5);

最后的结果是2,3,5,4,1

下面用图来展示下事件循环的过程

posted @ 2019-03-26 17:57  ABC袁  阅读(173)  评论(0编辑  收藏  举报