Analisando o código abaixo:
function rand(min = 1000, max = 3000){
return Math.floor(Math.random() * (max - min) + min)
}
function f1(callback){
setTimeout(function(){
console.log('f1')
if(callback)
callback()
}, rand())
}
function f2(callback){
setTimeout(function(){
console.log('f2')
if(callback)
callback()
, rand()})
}
function f3(callback){
setTimeout(function(){
console.log('f3')
if(callback)
callback()
}, rand())
}
f1(function(){
f2(function(){
f3(function(){
console.log('Terminei')
})
})
})
A função rand() é responsável por gerar um número aleatório entre 1000 e 3000. Abaixo dela, defino três funções - f1(), f2() e f3() - que recebem uma callback e, caso seja enviada uma callback na invocação da função, essa é chamada/executada somente após a função exibir o console.log().
É importante perceber que, em cada função - f1(), f2() e f3() - há uma chamada à função setTimeout(), passando para ela um tempo aleatório, entre 1 e 3 segundos. Fiz isso para simular uma situação real, na qual não sabemos o tempo necessário para o término de uma tarefa feita por uma função.
Terminando a declaração das funções, então invoco as três funções, de forma aninhada, usando funções anônimas, e passando para elas a próxima função a ser executada (em forma de callback). O meu intuito é fazer com que o resultado produzido pelo script seja, SEMPRE:
"f1"
"f2"
"f3"
"Terminei."
Ou seja, nesse caso, quero que a palavra "Terminei" seja exibida na tela somente quando f3() tiver exibido seu texto, f2() tiver exibido o seu, e f1() também. Em outras palavras, quero que, embora f1() leve 1 hora para ser executada (devido ao tempo aleatório configurado em setTimeout()), f2() terá que esperá-la para exibir seu texto e f3() também terá que esperar por f2().
E é exatamente esse resultado que obtenho quando chamo essas funções em forma da callback hell, como visto no código. Elas sempre executam em ordem. Mas tem um problema, se eu não usar função anônima no argumento das funções, a execução delas fica fora de ordem e eu gostaria de entender o porquê.
Se, agora, eu as chamar assim, sem o uso de funções anônimas:
f1(f2(f3(console.log('Terminei')))
a ordem desejada não é obedecida, sendo que, a meu ver, é a mesma chamada anterior, com a diferença de que não usei funções anônimas como argumento.