一个Promise面试题


原文地址: https://github.com/lzlu/Blog/issues/7git

本文没有什么干货,只是提供了一个面试题的解答思路。github

这个题目是以前面试的时候遇到的,当时没答对。虽然这种题目看起来对写代码并没什么实际意义,但说到底仍是本身对JS执行机制不够深刻了解。面试

就拿这题目拿出来分享给你们一些解题思路。 对JS执行机制不够了解的建议先看了这篇这一次,完全弄懂 JavaScript 执行机制 - 掘金,再食用。函数

很少说了,上酸菜,哦不对,题目。post

const first = () => (new Promise((resolve,reject)=>{
    console.log(3);
    let p = new Promise((resolve, reject)=>{
         console.log(7);
        setTimeout(()=>{
           console.log(5);
           resolve(6); 
        },0)
        resolve(1);
    }); 
    resolve(2);
    p.then((arg)=>{
        console.log(arg);
    });

}));

first().then((arg)=>{
    console.log(arg);
});
console.log(4);
复制代码

第一轮事件循环

先执行宏任务,主script ,new Promise当即执行,输出【3】,执行p这个new Promise 操做,输出【7】,发现setTimeout,将回调放入下一轮任务队列(Event Queue),p的then,姑且叫作then1,放入微任务队列,发现first的then,叫then2,放入微任务队列。执行console.log(4),输出【4】,宏任务执行结束。ui

再执行微任务,执行then1,输出【1】,执行then2,输出【2】。到此为止,第一轮事件循环结束。开始执行第二轮。spa

第二轮事件循环

先执行宏任务里面的,也就是setTimeout的回调,输出【5】。resovle不会生效,由于p这个Promise的状态一旦改变就不会在改变了。 因此最终的输出顺序是三、七、四、一、二、5。code

总结

对JavaScript执行机制有了解,而且知道Promise构造函数是当即执行的,这个题目相信仍是很简单的。队列

相关文章
相关标签/搜索