0

Analisemos o trecho de código abaixo, em JavaScript:

function rand(min = 1000, max = 4000){
        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')
            })
        })
    })

Na chamada de f1, passamos uma função de callback, que é uma função anônima. Essa, por sua vez, chama a função f2(), passando outra função de callback. Dentro dessa função de callback passada para f2(), acontece uma chamada para f3(), passando para mesma outra função de callback. Na última função de callback passada, executamos o console.log('Terminei').

Seguindo esse esquema, temos a garantia de a função f3() será sempre a última a ser executada, já que, na definição dessas funções, elas recebem uma callback - e executam esse callback por último.

No entanto, substituindo a chamada à função f1() pelo seguinte código: f1(f2(f3(console.log('Terminei.'))), NÃO OBTENHO O MESMO RESULTADO QUE ANTERIORMENTE, COM O USO DE FUNÇÕES ANÔNIMAS PASSADAS COMO ARGUMENTOS, isto é, quando eu não uso funções anônimas, não tenho garantia de que a última função a executar será a f3() e a primeira, a f1().

Desta forma, queria saber qual a diferença entre passar uma função anônima (que chama uma função X) e a própria função X para uma função que recebe uma callback. Por que há diferença no fluxo de execução (isto é uma função não esperou que a outra terminasse para exibir seu texto), nesse caso?

1 Resposta 1

3

Eu respondi o que estava na pergunta original. Que inclusive foi respondido igual, mas resumidamente em Como determinar a ordem de execução de funções callbacks sem recorrer às funções anônimas e como funciona a pilha de execução de funções em JS? e a resposta foi aceita. mesmo depois de edições a resposta ainda faz afirmações que não são demonstradas, e na verdade ficou tudo comprometido. Deixo o conteúdo aqui para as pessoas que quiserem saber o que foi perguntado originalmente aproveitar.


Não, você pode passar uma função normal, mas esta função é a que será executada como callback. Quando passou uma função anônima era o que desejava. Quando passou a função log() de console não era o que você queria, então o resultado que esperava não aconteceu.

Quando passa uma função qualquer é ela que será executada, e é claro que ela precisa ser compatível com o que será chamado internamente como callback. Então se a chamada não usa argumentos, uma função que não aceita argumentos é o que deveria ser passado. Assim como se passar um argumento a função a ser passada deveria receber um argumento, e assim por diante. E não basta ser o mesmo número de parâmetros que a função tenha em relação ao número de argumentos passados, precisa ter coerência. Precisa ser do tipo certo, não pode passar um texto se vai mandar calcular uma porcentagem. Não pode passar um número de uma rua quando você espera o valor de uma prestação, precisa fazer sentido.

Tudo tem a ver com o uso de argumentos na chamada. Vou explicar em detalhes.

O que você fez não faz sentido. Qual a função que passou no segundo exemplo (não postado)? Foi a console.log(), certo? E é ela que será chamada, e foi chamada, mesmo que você não tenha visto. Não deu erro algum. Quando chega na linha callback() da função f3() é exatamente a console.log() que será executada. Mas o que está mandando imprimir? Nada. E é isso que imprime no console. Quem determinada o que passar como argumento é quem chama e quem chamou está passando nada.

Por alguma razão você acha que o argumento 'Terminei' está sendo passado junto com a função e por alguma razão mágica a chamada consideraria isto, mas nada disto acontece. Em outra linguagem provavelmente essa sintaxe daria erro, mas JS permite que escreva assim mesmo que esse argumento será ignorado. Ele não vai junto com a função. Isso é o mesmo que passar nada, até porque é exatamente o que acontece.

Na verdade esse código deveria ser assim:

f1(f2(f3(console.log)))

Agora está mais claro que você está passando a função e não o argumento. Dá na mesma, mas é mais legível assim porque passa a intenção correta.

E aí não acontece que o estava esperando, acaba imprimindo nada, mas há uma impressão, é nada porque foi passado nada na chamada.

Mas vou dar um exemplo que faz o que quer sem usar função anônima. Vou criar uma função sem parâmetros que faz o que deseja e vou usá-la como callback, não é uma função anônima:

function rand(min = 1, max = 2){
    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())
}

function imprime() {
    console.log('Terminei.')
}

f1(f2(f3(imprime)));

Coloquei no GitHub para referência futura.

Pode estar pensando que então precisa sempre criar uma função para passar. Também não, só criei uma para compatibilizar a intenção, fazer sentido. Posso mandar a função direto, desde que queira algo um pouco diferente:

function rand(min = 1, max = 2){
    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('Terminei.')
    }, rand())
}

f1(f2(f3(console.log)));

Coloquei no GitHub para referência futura.

Novamente, quem chama é que determina qual será os argumentos passados.

Lembre-se que o callback é um atraso na execução, quando manda executar é que o estado é usado. É o mesmo problema que algumas pessoas não entendem porque um laço pega sempre o valor final e não cada valor da variável quando é transferido para um callback (mais detalhado).

18
  • Acho que minha pergunta foi mal entendida. Vou tentar explicar de outra maneira. A minha intenção é que as funçoes f1(), f2() e f3() sejam executadas EXATAMENTE NESSA ORDEM. Lembrando que as três funções recebem uma callback e executam primeiro o console.log dentro do corpo delas e, depois, fazem uma chamada à callback recebida. Se prestar atenção, setei tempos aleatórios, por meio da setTimeout para cada uma, porque quero simular uma situação real (onde não se sabe o tempo de execução para cada função - uma requisição, por exemplo). Commented 14/01/2020 às 22:35
  • no entanto, quando uso funções anônimas, chamando, dentro das funções anônimas, a próxima função, o resultado é o esperando: UMA FUNÇÃO SENDO EXECUTADA SOMENTE DEPOIS DE DE A ANTERIOR A ELA TER SIDO EXECUTADA. Porém, não é isso que acontece quando eu chamo as funções sem usar funções anônimas como argumento. É isso que gostaria saber: porque o fluxo de execução muda quando não uso funções anônimas como argumento, isto é, porque uma função não esperou a anterior a ela terminar para, então ser executada. Commented 14/01/2020 às 22:35
  • 3
    Agora ficou claro que a pergunta era essa mesmo que eu respondi, não entendi bem o que houve aqui. Fez outra pergunta que deram a mesma resposta sem detalhes e ela foi aceita. Aquela resposta não fala nada do que foi comentado aqui em cima e ela foi considerada certa, pelo contrário, ela fala do argumento que eu falei aqui e agora ressaltei que é isso, eu só dei mais detalhes. Acho que ficou claro que nem o AP entendeu sua própria pergunta. Ou então tem birra aí.
    – Maniero
    Commented 15/01/2020 às 11:52
  • 2
    É a última vez que eu escrevo aqui até porque você parece aletrado e não querer progredir na conversa. Tem feito uma coisa errada atrás da outra para querer impor algo que não consegue. Eu respondi o que perguntou inicialmente. Você já deixou claro que não gostou, já negativou a resposta, fez alterações que não deveria porque uma resposta já havia sido dada em cima do que perguntou. Não ajudou sua situação você tendo aceitando uma resposta em outra pergunta igual e que respondia o mesmo que eu respondia aqui, nada do que você está falando agora. Então seus comentários não fazem sentido.
    – Maniero
    Commented 17/01/2020 às 1:11
  • 3
    Você já obteve uma resposta que você queria lá na outra pergunta, então esqueça essa pergunta, ela ficou para quem quer aprender algo sobre o que perguntou originalmente. Você já deixou claro que não ficou satisfeito aqui e que ficou lá na outra pergunta. O assunto está encerrado. Não insista, não faz sentido.
    – Maniero
    Commented 17/01/2020 às 1:13

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .