Skip to main content
título editado
Link
Maniero
  • 484,4mil
  • 94
  • 1,3mil
  • 2,2mil

Como fazer que funções que recebem callbacks seja executadas numa ordem específica, em JavaScript?

título editado e corpo editado
Fonte Link

Em JavaScript, para uma função Como fazer que recebe uma callbackfunções que recebem callbacks seja executadas numa ordem específica, devemos sempre passar uma função anônimaem JavaScript?

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

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.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.

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?

Em JavaScript, para uma função que recebe uma callback, devemos sempre passar uma função anônima?

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')
            })
        })
    })

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.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.

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, nesse caso?

Como fazer que funções que recebem callbacks seja executadas numa ordem específica, 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')
            })
        })
    })

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.

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?

Pergunta fechada como "Precisa de detalhes ou esclarecimentos" por Maniero
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')
        })
    })
})

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')
            })
        })
    })

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')
        })
    })
})

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')
            })
        })
    })

título editado
Link
Carregando
Fonte Link
Carregando