• js,timeout,promise执行顺序


    总结

    1. macro-task包括:script(整体代码), setTimeout, setInterval, setImmediate, I/O, UI rendering。

    2. micro-task包括:process.nextTick, Promises, Object.observe, MutationObserver

    总的来说就是:

    1. 不同的任务会放进不同的任务队列之中。

    2. 先执行macro-task,等到函数调用栈清空之后再执行所有在队列之中的micro-task。

    3. 等到所有micro-task执行完之后再从macro-task中的一个任务队列开始执行,就这样一直循环。

    4. 当有多个macro-task(micro-task)队列时,事件循环的顺序是按上文macro-task(micro-task)的分类中书写的顺序执行的。

    先执行正常栈中的代码,在执行micro-task,然后是macro-task.

    也就是set开头的最后执行,promise在set之前,promise方法里的第一个执行方法不入栈,在正常栈里执行

    console.log('golb1');
    setImmediate(function() {
        console.log('immediate1');
        process.nextTick(function() {
            console.log('immediate1_nextTick');
        })
        new Promise(function(resolve) {
            console.log('immediate1_promise');
            resolve();
        }).then(function() {
            console.log('immediate1_then')
        })
    })
    setTimeout(function() {
        console.log('timeout1');
        process.nextTick(function() {
            console.log('timeout1_nextTick');
        })
        new Promise(function(resolve) {
            console.log('timeout1_promise');
            resolve();
        }).then(function() {
            console.log('timeout1_then')
        })
        setTimeout(function() {
            console.log('timeout1_timeout1');
        process.nextTick(function() {
            console.log('timeout1_timeout1_nextTick');
        })
        setImmediate(function() {
            console.log('timeout1_setImmediate1');
        })
        });
    })
    new Promise(function(resolve) {
        console.log('glob1_promise');
        resolve();
    }).then(function() {
        console.log('glob1_then')
    })
    process.nextTick(function() {
        console.log('glob1_nextTick');
    })

    上面的代码要在node环境里执行,

    结果如下:

    golb1
    glob1_promise
    glob1_nextTick
    glob1_then
    timeout1
    timeout1_promise
    timeout1_nextTick
    timeout1_then
    immediate1
    immediate1_promise
    immediate1_nextTick
    immediate1_then
    timeout1_timeout1
    timeout1_timeout1_nextTick
    timeout1_setImmediate1

    学而不思则罔,思而不结则殆,结而不看,一事无成
  • 相关阅读:
    00045_多态-转型
    js下载文件夹的解决方案
    b/s下载文件夹的解决方案
    web下载文件夹的解决方案
    jsp下载文件夹的解决方案
    php下载文件夹的解决方案
    asp.net下载文件夹的解决方案
    KindEditor 从word中复制内容带多张图片
    CKEditor 从word中复制内容带多张图片
    Web编辑器 从word中复制内容带多张图片
  • 原文地址:https://www.cnblogs.com/windseek/p/8569522.html
Copyright © 2020-2023  润新知