обратный вызов вызывается до выполнения остальной части функции

Question

Я воссоздал этот пример (по ссылке, приведенной ниже), чтобы понять обратные вызовы.Проблема в том, что обратный вызов выполняется до завершения родительской функции first ().setTimeout работает нормально, но обратный вызов не ждет до тех пор, пока не произойдет указанное выше.Если я закомментирую строки 1 и 3 функции first (), то есть части тайм-аута, то она регистрируется в правильном порядке.

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

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

first(second);

Если это работает нормально, и я неправильно понимаю природуof setTimeout, тогда, пожалуйста, приведите еще один пример, где обратный вызов можно увидеть ожидающим.
Ссылка: https://codeburst.io/javascript-what-the-heck-is-a-callback-aba4da2deced
Примечание: я знаю очень мало JS, на самом деле работал в PHP, поэтому, пожалуйста, дайте простое объяснение.Спасибо

Answer 1

Похоже, вы неправильно поняли, как работает setTimeout().Этот инструмент под названием «Loupe» от Philip Roberts может помочь вам понять.Я взял ваш код и поместил его в инструмент, который позволит вам визуализировать то, что на самом деле происходит - ссылка на лупу

Когда вы используете setTimeout, эта функция предоставляется как перваяПараметр задерживается на количество миллисекунд, указанное во втором параметре (в вашем примере это 1000).Остальная часть вашего кода будет продолжать выполняться по порядку, пока не истечет этот тайм-аут.

Если вы хотите, чтобы ваша функция callback выполнялась после заданного тайм-аута: вы можете просто написать ее так:

setTimeout(callback, 1000) <- Поскольку <code>callback уже является функцией, вам не нужно заключать ее в другую функцию, если вы не хотите выполнять другие операции перед вызовом обратного вызова.

---

Обновление 1 (2018-10-26):

function second() {
    console.log("second/callback function")
}

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

first(second);

Answer 2

Здесь вы вызываете «обратный вызов» синхронно, что означает, что первая функция будет ждать завершения второй (обратного вызова) функции и затем продолжит ее выполнение.Чтобы лучше это понять, я разместил консольный журнал и в других местах.Пожалуйста, попробуйте ниже и посмотрите, если у вас есть лучшее понимание для того же

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);