Función Async/Await en JavaScript

Todos sabemos que JavaScript es síncrono por naturaleza, lo que significa que tiene un bucle de eventos que le permite poner en cola una acción que no tendrá lugar hasta que el bucle esté disponible en algún momento después de que el código que puso en cola la acción haya terminado de ejecutarse.

Pero hay muchas funcionalidades en nuestro programa que hacen que nuestro código sea asíncrono y una de ellas es la funcionalidad Async/Await. Async/Await es la extensión de las promesas que obtenemos como soporte en el lenguaje. 

Puede consultar Promesas en Javascript para saber más al respecto. 

Las siguientes secciones describirán más sobre async y await en detalle junto con algunos ejemplos (ejemplos individuales y combinados de async-await):

Async: Simplemente nos permite escribir código basado en promesas como si fuera sincrónico y comprueba que no estamos rompiendo el hilo de ejecución. Funciona de forma asíncrona a través del bucle de eventos. Las funciones asíncronas siempre devolverán un valor. Se asegura de que se devuelva una promesa y, si no se devuelve, JavaScript la envuelve automáticamente en una promesa que se resuelve con su valor.

Ejemplo 1: 

const getData = async() => {
    var data = "Hello World";
    return data;
}
 
getData().then(data => console.log(data));

Producción:

Hello World

Await: la función Await se utiliza para esperar la promesa. Solo se puede usar dentro del bloque asíncrono. Hace que el código espere hasta que la promesa devuelva un resultado. Solo hace que el bloque asíncrono espere.

Ejemplo-2:

const getData = async() => {
    var y = await "Hello World";
    console.log(y);
}
 
console.log(1);
getData();
console.log(2);

Producción:

1
2
Hello World

Observe que la consola imprime 2 antes de “Hello World” . Esto se debe al uso de la palabra clave await. 

Ejemplo-3: En este ejemplo, implementaremos varias promesas en un método y luego usaremos ese método para mostrar nuestro resultado.

function asynchronous_operational_method() {
  let first_promise = new Promise((resolve, reject) => resolve("Hello"));
  let second_promise = new Promise((resolve, reject) => {
    setTimeout(() => {
      resolve(" GeeksforGeeks..");
    }, 1000);
  });
  let combined_promise = Promise.all([first_promise, second_promise]);
  return combined_promise;
}
 
async function display() {
  let data = await asynchronous_operational_method();
  console.log(data);
}
 
display();

Producción:

[ 'Hello', ' GeeksforGeeks..' ]

Navegadores compatibles: los navegadores compatibles con la función Async/Await se enumeran a continuación:

• Google Chrome 55 y superior
• Firefox 52 y superior
• Apple Safari 10.1 y superior
• Ópera 42 y superior
• Borde 14 y superior

JavaScript es mejor conocido por el desarrollo de páginas web, pero también se usa en una variedad de entornos que no son de navegador. Puede aprender JavaScript desde cero siguiendo este tutorial de JavaScript y ejemplos de JavaScript .