Ejecución asincrónica en JavaScript

En muchos lenguajes de programación, los procesos asincrónicos se manejan generando un nuevo hilo que funciona en segundo plano. Sin embargo, en JavaScript, tenemos un concepto llamado contexto de ejecución y bucle de eventos, que evita que el resto del código se ejecute. Cuando el contexto de ejecución descubre dichos bloques de código en un programa, los envía nuevamente al bucle de eventos para su ejecución antes de devolverlos a la pila de llamadas. Hay tres tipos básicos de métodos de código asincrónico en la programación de JavaScript: devoluciones de llamada, promesas y palabras clave async/esperanza.

Este artículo discutirá Ejecución asincrónica en JavaScript. Además, también demostraremos los métodos de JavaScript para ejecutar la ejecución asincrónica, como Devoluciones de llamada, Promesas, asíncrono/espera, con la ayuda de ejemplos. Entonces, comencemos!

Devoluciones de llamada con ejecución asincrónica en JavaScript

Las devoluciones de llamada son uno de los estilos de codificación más comunes para expresar y manejar la ejecución asincrónica en JavaScript. Es un tipo de función que debe llamarse después de que otra función haya completado su ejecución. La función de devolución de llamada se invoca con la respuesta cuando se completa la operación especificada. Supongamos que desea asegurarse de que un código particular en su programa JavaScript no se ejecute hasta que el otro termine su ejecución. En ese caso, puede lograr esta funcionalidad utilizando la función de devolución de llamada.

Ejemplo: devoluciones de llamada con ejecución asincrónica en JavaScript

Permítanos darle un ejemplo que le ayudará con lo que hemos declarado. Considere un escenario en el que debe escribir una cadena en una secuencia de documentos después de 7 segundos. En este caso, puede usar el "setTimeout ()"JavaScript Función incorporada que evalúa una expresión o llama a cualquier función después de una cantidad de tiempo especificada. En nuestro caso, hemos utilizado la función "setTimeOut ()" para invocar la definida "myFunction ()"Después de 7 segundos:

Espere 7 segundos (7000 milisegundos)

Puede ejecutar el ejemplo anterior en su editor de código favorito o en cualquier Sandbox de codificación en línea; Sin embargo, utilizaremos el JSBIN para el propósito de demostración:

Después de ejecutar el programa JavaScript proporcionado, se le pedirá que espere "7 segundos":

Después de 7 segundos, la cadena "Ejecución asincrónica en JavaScript"Se mostrará como salida:

Promesas con ejecución asincrónica en JavaScript

Cuando encadenan varias llamadas de función, uno de los principales problemas de las devoluciones de llamada es que se hace difícil rastrear el flujo de la ejecución. El ".entonces()"Sintaxis en"Promesas"Te rescata en tal situación mientras te permite encadenar las promesas juntas. Le permite vincular los controladores con el valor asincrónico agregado del éxito o la causa de la falla. Como resultado, los métodos asincrónicos se comportarán de manera similar a los sincrónicos.

En lugar de proporcionar el valor final de inmediato, la técnica asincrónica devuelve una promesa que ofrece el valor que se puede utilizar en el procesamiento posterior. Su objeto de promesas puede estar en uno de los tres estados: pendiente, cumplido o rechazado:

• Pendiente: Antes de que ocurra una operación, la promesa adicional está en un estado pendiente.
• Satisfecho: El estado cumplido de una promesa significa que la operación adicional se ha completado.
• Rechazado: Cuando se lanza un valor de error para la operación incompleta, la promesa se encuentra bajo el estado rechazado.

Ejemplo: Promesas con ejecución asincrónica en JavaScript

Para mostrar el funcionamiento de las promesas con la ejecución asincrónica en JavaScript, en primer lugar, definiremos un "Mostrar mensaje()Función que se invocará tanto para el éxito como para el fracaso de la promesa adicional:

La ejecución del código anterior le mostrará la siguiente salida:

Ahora, a propósito, cambiaremos el valor de la variable "a"Para verificar si la devolución de llamada para la falla de la promesa está funcionando o no:

Como puede ver, la devolución de llamada para la falla se muestra "Error encontrado"Cadena de acuerdo con nuestra codificación del programa JavaScript:

async/espera con ejecución asincrónica en JavaScript

El "asíncrata" y "esperar"Se agregan palabras clave a la versión más reciente de JavaScript. Estas palabras clave hacen que la escritura sea más fácil y permiten al usuario tener un control completo sobre la secuencia de la ejecución de las promesas. La función async siempre devuelve promesas, y la función de espera se utiliza en la función async para detener la ejecución del método agregado mientras se espera que la promesa se resuelva. Después de eso, reanudará la ejecución de la función y emitirá el valor resuelto.

Ejemplo: Async con ejecución asíncrona en JavaScript

Ahora, en el mismo ejemplo, agregaremos un async myFunction () que devuelve una promesa:

Eche un vistazo al código proporcionado y su salida:

Ejemplo: espera con la ejecución asincrónica en JavaScript

En este ejemplo, primero agregaremos el "asíncrata"Palabra clave con la definición de función showMessage () para obtener una promesa. Después de hacerlo, especificaremos "esperar"Con el creado"mi promesa"Objeto para que espere la mypromise:

Aquí está el resultado que obtuvimos al ejecutar el ejemplo anterior:

Conclusión

Las devoluciones de llamada, las promesas y las palabras clave async/esperas son los tres métodos para manejar la ejecución asíncrona en JavaScript. Las devoluciones de llamada permiten el acceso a las funciones cuando el método asíncrono ha completado la ejecución; Las promesas ayudan a encadenar el método juntos, y la palabra clave async/esperanza proporciona control adicional sobre las promesas. Este artículo discutió la ejecución asincrónica en JavaScript. Además, también demostramos los métodos de ejecución asincrónica, como devoluciones de llamada, promesas, async/esperanza en JavaScript con ejemplos.