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工具可能会帮助您理解。我已将您的代码放入工具中，该工具可让您直观地看到实际发生的情况-link to 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);

在执行其余函数之前调用回调

2 个答案: