一個Promise面試題

雅南暗影發表於2018-05-13
Promise面試題

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

本文沒有什麼乾貨，只是提供了一個面試題的解答思路。

這個題目是之前面試的時候遇到的，當時沒答對。雖然這種題目看起來對寫程式碼並沒什麼實際意義，但說到底還是自己對JS執行機制不夠深入瞭解。

就拿這題目拿出來分享給大家一些解題思路。 對JS執行機制不夠了解的建議先看了這篇這一次，徹底弄懂 JavaScript 執行機制 - 掘金，再食用。

不多說了，上酸菜，哦不對，題目。

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】,巨集任務執行結束。

再執行微任務，執行then1，輸出【1】，執行then2，輸出【2】。到此為止，第一輪事件迴圈結束。開始執行第二輪。

第二輪事件迴圈

先執行巨集任務裡面的，也就是setTimeout的回撥，輸出【5】。resovle不會生效，因為p這個Promise的狀態一旦改變就不會在改變了。 所以最終的輸出順序是3、7、4、1、2、5。

總結

對JavaScript執行機制有了解，並且知道Promise建構函式是立即執行的，這個題目相信還是很簡單的。

相關文章