在執行其余函數之前調用回調

Question

我重新創建了這個例子（來自下面給出的鏈接）來理解回調。 問題是回調在父函數 'first()' 完成之前被執行。 setTimeout 工作正常，但回調不會等到上述之后。 如果我注釋掉 first() 的第 1 行和第 3 行，即超時部分，那么它會以正確的順序登錄。

<script type="text/javascript">
function second() {
    console.log("second/callback function")
}

function first(callback){
    setTimeout(function(){
        console.log("first function")
    }, 1000 );
    callback();
}

first(second);

如果這工作正常並且我誤解了 setTimeout 的性質，那么請舉另一個可以看到回調等待的示例。
鏈接： https : //codeburst.io/javascript-what-the-heck-is-a-callback-aba4da2deced
注：我對JS知之甚少，實際上是用PHP工作的，所以請給一個簡單的解釋。 謝謝

Answer 1

在這里，您同步調用“回調”，這意味着第一個函數將等待第二個（回調）函數完成，然后繼續執行。 為了更好地理解它，我也在其他地方放置了控制台日志。 請在下面嘗試，看看您現在是否對相同的有更好的理解

 function second() { console.log('second method started') setTimeout(() => console.log("second function executed"), 1000) console.log('second method finished') } function first(callback){ console.log('first method started') setTimeout(() => console.log("first function executed"), 1000 ); callback(); console.log('first method finished') } first(second);

Answer 2

您似乎誤解了setTimeout()工作原理。 這個由 Philip Roberts 稱為 Loupe 的工具可以幫助您理解。 我已將您的代碼放入工具中，該工具可讓您可視化實際發生的情況 - 鏈接至 Loupe

當您使用setTimeout ，作為第一個參數提供的函數會延遲第二個參數中提供的毫秒數（在您的示例中，這是1000 ）。 其余代碼將繼續按順序執行，直到超時結束。

如果您希望您的callback函數在給定的超時后執行：您實際上可以這樣編寫：

setTimeout(callback, 1000) <- 由於callback已經是一個函數，你不需要將它包裝在另一個函數中，除非你想在調用回調之前做其他操作。

---

更新 1 (2018-10-26)：

 function second() { console.log("second/callback function") } function first(callback){ console.log("first function") setTimeout(callback, 1000); } first(second);