微任务与宏任务

Posted ljh--

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了微任务与宏任务相关的知识,希望对你有一定的参考价值。

        setTimeout(_ => console.log(4))

        new Promise(resolve => {
        resolve()
        console.log(1)
        }).then(_ => {
        console.log(3)
        Promise.resolve().then(_ => {
            console.log('before timeout')
        }).then(_ => {
            Promise.resolve().then(_ => {
            console.log('also before timeout')
            })
        })
        })

        console.log(2)
    setTimeout 作为宏任务来存在 而 Promise.then 则是 微任务 上述代码按序号输出
    所有会进入的异步都是指的事件回调中的那部分代码
    在同步代码执行完成后才回去检查是否有异步任务完成,并执行对应的回调,而微任务又会在宏任务之前执行
    继续在Promise 中实例化Promise 其输出依然会早于 setTimeout 的宏任务

    Event - Loop 是个啥?

    javascript是一个单线程的语言,同意时间不能处理多个任务 

    就像我们去银行办理业务的时候

    每办理完一个业务,柜员就会问当前的用户,是否还有其他需要办理的业务(检查还有没有微任务需要处理)

    而客户明确告诉说没有事情以后,柜员就会查看后边还有没有等着办业务的人(结束本次宏任务,检查还有没有宏任务需要处理)

    如果客户说还有要办理的业务(微任务) 就得接着办理,直到办理完成 (在当前的微任务没有执行完成时,是不会执行下一个宏任务的)

以上是关于微任务与宏任务的主要内容,如果未能解决你的问题,请参考以下文章

一篇搞定(Js异步事件循环与消息队列微任务与宏任务)

一篇搞定(Js异步事件循环与消息队列微任务与宏任务)

Promise特性

JS事件循环机制(event loop)之宏任务/微任务

译文:18个实用的JavaScript代码片段,助你快速处理日常编程任务

微任务和宏任务哪个先执行?