O único problema com promessas é que o IE não as suporta. O Edge faz isso, mas existem muitos IE 10 e 11 por aí: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise (compatibilidade na parte inferior)
Portanto, o JavaScript é de thread único. Se você não estiver fazendo uma chamada assíncrona, ela se comportará de forma previsível. O thread principal do JavaScript executará uma função completamente antes de executar a próxima, na ordem em que aparecem no código. Garantir a ordem das funções síncronas é trivial - cada função será executada completamente na ordem em que foi chamada.
Pense na função síncrona como uma unidade atômica de trabalho . O principal encadeamento JavaScript o executará totalmente, na ordem em que as instruções aparecerem no código.
Mas, ative a chamada assíncrona, como na seguinte situação:
showLoadingDiv(); // function 1
makeAjaxCall(); // function 2 - contains async ajax call
hideLoadingDiv(); // function 3
Isso não faz o que você quer . Ele executa instantaneamente a função 1, a função 2 e a função 3. O carregamento de div pisca e desaparece, enquanto a chamada ajax não está quase completa, apesar de makeAjaxCall()
ter retornado. A COMPLICAÇÃO é que makeAjaxCall()
dividiu seu trabalho em partes que são avançadas pouco a pouco a cada rotação do encadeamento principal do JavaScript - está se comportando de maneira assícrona. Mas esse mesmo encadeamento principal, durante uma rodada / execução, executou as partes síncronas de forma rápida e previsível.
Então, do jeito que eu lidei com isso : como eu disse, a função é a unidade atômica do trabalho. Combinei o código da função 1 e 2 - coloquei o código da função 1 na função 2, antes da chamada assíncrona. Livrei-me da função 1. Tudo, inclusive a chamada assíncrona, é executada de maneira previsível, em ordem.
ENTÃO, quando a chamada assíncrona for concluída, após várias rotações do encadeamento JavaScript principal, faça com que ela chame a função 3. Isso garante a ordem . Por exemplo, com ajax, o manipulador de eventos onreadystatechange é chamado várias vezes. Quando ele relatar sua conclusão, chame a função final desejada.
Eu concordo que é mais confuso. Eu gosto de ter um código simétrico, de funções fazer uma coisa (ou quase), e não gosto de ter a chamada ajax de forma alguma responsável pela exibição (criando uma dependência no chamador). MAS, com uma chamada assíncrona incorporada em uma função síncrona, é necessário fazer compromissos para garantir a ordem de execução. E eu tenho que codificar para o IE 10, então não há promessas.
Resumo : para chamadas síncronas, garantir a ordem é trivial. Cada função é executada totalmente na ordem em que foi chamada. Para uma função com uma chamada assíncrona, a única maneira de garantir a ordem é monitorar quando a chamada assíncrona for concluída e chamar a terceira função quando esse estado for detectado.
Para uma discussão sobre threads JavaScript, consulte: https://medium.com/@francesco_rizzi/javascript-main-thread-dissected-43c85fce7e23 e https://developer.mozilla.org/en-US/docs/Web/JavaScript/ EventLoop
Além disso, outra pergunta semelhante e bem cotada sobre esse assunto: como devo chamar 3 funções para executá-las uma após a outra?
firstFunction
exatamente isso faz com que seja assíncrono? De qualquer maneira - verificação sobre promessas