美文网首页
微任务、宏任务、立即执行函数(async await)

微任务、宏任务、立即执行函数(async await)

作者: Simon_s | 来源:发表于2019-08-15 10:32 被阅读0次
    async function b() {
        console.log('b');
        await c();
        console.log('b1');
    }
    
    async function c() {
        console.log('c');
        await new Promise(function(resolve, reject) {
            console.log('promise1');
            resolve();
        }).then(() => {
            console.log('promise1-1');
        });
        setTimeout(() => {
            console.log('settimeout1');
        });
        console.log('c1');
    }
    
    new Promise(function(resolve, reject) {
        console.log('promise2');
        resolve();
        console.log('promise2-1');
        reject();
    }).then(() => {
        console.log('promise2-2');
        setTimeout(() => {
            console.log('settimeout2');
            new Promise(function(resolve, reject) {
                resolve();
            }).then(function() {
                console.log('?');
            });
        });
    }).catch(() => {
        console.log('promise-reject');
    });
    
    console.log('200');
    
    b();
    
    promise2   
    promise2-1
    200
    b
    c
    promise1
    promise2-2
    promise1-1
    c1
    b1
    settimeout2
    ?
    settimeout1
    
    微任务:
    1、promise2-2 
    2、promise1-1
    
    宏任务
    1、settimeout2
    2、settimeout1
    
    步骤讲解:
    1、从上自下执行, new Promise 函数立即执行              打印 :promise2   一
    2、resolve()   将  promise2-2   放入微任务队列中
    3、继续向下执行                                       打印 :promise2-1  二
    4、settimeout2放入宏任务队列
    5、继续执行、无立即执行                                  打印 :200       三
    6、执行  b() 函数                                              打印 :b  四
    7、执行  await c() 函数                                        打印:c   五
    8、进入 await c() 函数  中  nen Promise 函数             打印 :promise1  六
    9、resolve()   将  promise1-1   放入微任务队列中
    10、settimeout1  放入宏任务队列
    11、暂无执行任务   去微任务中 执行第一个进入微任务的待执行动作  打印:promise2-2   七
    12、继续执行微任务中序列中待执行动作                           打印:promise1-1  八
    13、微任务中暂无执行 动作 继续执行  c()  函数中的待执行代码            打印:c1    九
    14、c() 执行完毕,继续执行 b() 函数中待执行代码                         打印:b1  十
    15、至此,立即执行以微任务执行完毕,执行宏任务队列中第一个进入的待执行任务       打印 :settimeout2   十一
    16、宏任务一中,执行 new Promise  函数    resolve()   将问号 放入微任务中   立即执行微任务  打印:? 十二
    17、继续执行宏任务中待执行动作                                                 打印:settimeout1   十三
    

    相关文章

      网友评论

          本文标题:微任务、宏任务、立即执行函数(async await)

          本文链接:https://www.haomeiwen.com/subject/wppajctx.html