La solución es hacer uso de versiones asíncronas de estas funciones. Llamémoslas asinc1()
y asinc2()
. Estas funciones retornan inmediatamente en el hilo principal, pero dejan "encargado" al Navegador que en otro hilo (dedicado a comunicaciones de red) haga las peticiones correspondientes.
Nota el hacer una función asíncrona no hace que se ejecute automáticamente en otro hilo, ni es un método mágico de ejecución "en paralelo". Si la rutina que llamamos de forma asíncrona se pone a hacer cálculos que acaparen la CPU, el hilo de GUI se resentiría igualmente. Sólo si la función asíncrona hace uso de entrada/salida bloqueante, típicamente acceso a red o disco, se puede beneficiar, pues en ese caso no se queda esperando a que la operación de entrada/salida termine, sino que vuelve inmediatamente y sólo más tarde, cuando la operación ha terminado (otros procesos como el operativo u otro hilo en el navegador la habrá completado), la tarea se reanuda y puede obtener la respuesta.
El problema es ¿qué ocurre una vez que esas peticiones se han completado? ¿A dónde va a parar la respuesta? Ya que necesitamos la respuesta de asinc1()
antes de poder invocar asinc2()
¿cómo se entera el hilo principalnuestro programa de cuándo terminó asinc1()
y cuál ha sido el resultado?
La anidación sería peor a medida que tengamos más funciones encadenadas (que se necesite el resultado de una para llamar a la siguiente), dando lugar a funciones que son parámetros de otras funciones, que son parámetros de otras, etc. y el código fuente adquiere una característica forma en la que se va indentando más y más para luego ir deshaciendo esa indentación a medida que se cierran llaves y paréntesis, estructura conocida como Pyramid of Doom, o Callback hell.
Por otro lado, en este código todotoda la lógica está "al revés" de algún modo, pues las funciones no retornan resultados, sino que pasan esos resultados como parámetros (a otras funciones), y las funciones que manejan la respuesta son a su vez pasadas como parámetros. El flujo de errores (en el que no entraré en esta respuesta) también se complica, pues ya no pueden usarse excepciones, sino que típicamente habría dos funciones callback, una a la que se llamaría en caso de éxito y otra en caso de error.
Las Promises evitan esta anidación, y hacen más simple el manejo de errores (cosa en la que no entro en esta respuesta). Una Promise tiene un método then()
al que le pasas una función, que será ejecutada automáticamente cuando la promesa se resuelva (o inmediatamente si ya estaba resuelta en el momento en que invocamos .then()
). Esta función recibirá como parámetro el valor de la promesa (el resultado esperado). Y lo mejor es que .then()
retorna a su vez una nueva Promise, que se resolverá cuando se ejecute la función que le habíamos asociado. De este modo se pueden encadenar varios .then()
para "simular" un código secuencial, del estilo de "cuando esta promesa se resuelva haz esto, y después, cuando esta otra se resuelva, haz esto otro, y después...)