瀏覽器和節點中的EventLoop有什么區別？

Question

Promise.resolve().then(() => {
  console.log('promise2')
  setTimeout(() => console.log('setTimeout2'))
})
setTimeout(() => {
  console.log('setTimeout1')
  Promise.resolve().then(() => console.log('promise1'))
})

在瀏覽器中運行代碼的結果：

promise2 -> setTimeout1 -> promise1 -> setTimeout2

但在節點

promise2 -> setTimeout1 -> setTimeout2 ->promise1 

Answer 1

首先，討論的第三條語句將計時器（t）和已實現的promise（f）回調的匿名函數標識為t1 ， t2 ， f1和f2 ：

Promise.resolve().then(() => { // f2
  console.log('promise2')
  setTimeout(() => console.log('setTimeout2') /* t2 */)
})  // statement 1

setTimeout(() => {  // t1
  console.log('setTimeout1')
  Promise.resolve().then(() => console.log('promise1'/* f1 */) // statement 3
}  // statement 2

語句1將¹ f2放置在Promise作業隊列（PJQ）中，假設Promise.resolve的參數不是Promise或thenable時，它會同步返回已實現的Promise。 then在已實現的Promise上進行調用，將在調用過程中將已實現的處理程序的執行分派給PJQ，稍后在處理Promise作業隊列時執行。

語句2將t1放在計時器回調隊列中。

¹執行后，promise處理程序將由執行者代碼監視then或catch返回的promise。

---

在瀏覽器中處理隊列，將優先級設置為Promise作業隊列：

PJQ:     <empty>
Timers:  t1, t2

調用f2，記錄“ promise2”，將t2添加到計時器隊列中

PJQ:    f1
Timers: t2

調用t1，記錄“ setTimeout1”，執行語句3，將f1添加到Promise作業隊列中。

PJQ:    <empty>
timers: t2

呼叫f1，記錄“ promise1”

 PJQ: <empty> timers: t2 

調用t2，記錄“ setTimeout2”。

因此，當承諾作業隊列的優先級高於計時器回調時，日志將顯示為“ promise2”，“ setTimeout1”，“ promise1”，“ setTimeout2”。

---

以創建順序處理計時器和承諾作業的隊列，這些隊列沒有優先級：

f2，t1

記錄“ promise2”，添加t2

t1，t2

記錄“ setTimeout1”，添加f1

t2，f1

記錄“ setTimeout2”

f1

記錄“ promise1”

因此，對於節點，日志的優先級相同，分別是“ promise2”，“ setTImeout1”，“ setTimeout2”，“ promise1”。

---

TLDR；

瀏覽器優先於承諾響應工作，而不是計時器回調。 節點與為計時器和承諾作業賦予相同的優先級是一致的，但請查閱文檔。

編碼承諾體系結構是一個veryBadIdea ^（tm） ，它依賴於計時器回調和承諾作業隊列執行的優先級。 這在主機環境（瀏覽器與節點）之間以及在本地Promise庫和JavaScript Promise庫之間可能有所不同，這些Promise庫和JavaScript Promise庫已被使用或作為舊瀏覽器中Promise的polyfill包括在內。