為什么這個簡單的回調在 setTimeout 之前執行？

Question

此代碼段在“輸出 1”之前記錄“輸出 2”，由於setTimeout ，這很酷。

 const func1 = () => { setTimeout(() => { console.log('output 1'); }, 3000); }; const func2 = () => { console.log('output 2'); }; func1(); func2();

在這個片段中，我使用了一個回調，但它給了我與上一個片段相同的結果，為什么func2不在func1之前執行？ 如何讓func2在func1之后執行？

 const func1 = () => { setTimeout(() => { console.log('output 1'); }, 3000); }; const func2 = () => { console.log('output 2'); }; const main = (a, b) => { a(); b(); }; main(func1, func2);

Answer 1

為什么 func1 不在 func2 之前執行

確實如此。

1. Func1 設置超時運行
2. Func2 日志
3. 3 秒后，您傳遞給setTimeout的回調 function 被調用

如果您想讓 Func2 在第 3 步之后運行，那么您需要在傳遞給setTimeout的回調結束時調用它。

Answer 2

簡單的解釋——

Function 2 不會等待在 function 1 中啟動的計時器完成。

func1();
func2();

當您執行這兩個函數時， function 1 設置定時器， function 2 注銷。

最終，function 1 3 秒后退出。

您的第二個片段的作用幾乎相同。

Answer 3

JavaScript 不等待 setTimeout 完成然后執行下一個函數。 當 javascript 遇到 setTimeOut 時，它會使用提供的超時存儲函數，在這種情況下為 3 秒。 將其存儲在調用堆棧中后，它才開始執行其下方的函數，並且由於第二個 function 中沒有任何內容，因此它會立即執行（顯然在 3 秒之前）。 這就是為什么您在第一個 function 的日志之前看到第二個 function 的日志的原因。 要執行第一個 function 然后執行第二個 function 您可以使用 promise 鏈接。 例子：

 return new Promise(function(resolve, reject) {
     setTimeout(() => {
        console.log('output 1');
        resolve();
     }, 3000);
 }).then(function(result) {
     console.log('output 2');
 });

希望它會有所幫助。 如果我錯了，請隨時糾正。