同步任务和异步任务

同步任务:立即执行的任务,直接被主线程读取并执行
异步任务:异步执行的任务,会交给任务队列去处理,而异步任务又分为宏任务和微任务

宏任务

script,setTimeout,setInternal,setImmeditate,T/O,UI rendering

微任务

process,nextTick,promise.then(),object.observe,MutationObserver

执行顺序

同步任务直接进入执行栈由主线程直接执行,而异步任务会先移交给WebAPIs去处理,当异步任务被触发会将其回调函数放入任务队列中。执行栈空,则访问微任务队列,当微任务队列空后再去访问宏任务队列,如果在执行宏任务时遇到了微任务,则将微任务放入微任务队列。

微任务执行前提是执行栈为空,宏任务执行前提是微任务队列为空。

实例:

		console.log('1')
        setTimeout(() => {
            console.log('2');
            new Promise(resolve => {
                console.log('3')
                resolve();
            }).then(() => {
                console.log('4')
            })
        }, 0)
        new Promise(resolve => {
            console.log('5')
            resolve();
        }).then(() => {
            console.log('6')
        })
        setTimeout(() => {
            console.log('7');
        }, 0)
        setTimeout(() => {
            console.log('8');
            new Promise(resolve => {
                console.log('9')
                resolve();
            }).then(() => {
                console.log('10')
            })
        }, 0)
        new Promise(resolve => {
            console.log('11')
            resolve();
        }).then(() => {
            console.log('12')
        })
        console.log('13');

在这里插入图片描述
执行栈空,查看微任务队列
在这里插入图片描述
执行微任务,微任务队列空则查看宏任务队列
在这里插入图片描述
执行宏任务时出现微任务,将微任务依次放入微任务队列,先执行微任务
在这里插入图片描述
最终控制台依次输出的结果是:1 5 11 13 6 12 2 3 4 7 8 9 10

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值