Tutorial JavaScript: Async / Await

Los conceptos de async y await en JavaScript es parte fundamental de la programación asíncrona, que permite que las operaciones no bloqueantes se lleven a cabo sin interrumpir el flujo principal del programa.

Funciones asíncronas (async)

Una función asíncrona se declara con la palabra clave async antes de la palabra clave function o antes de los paréntesis al usar una función flecha. Las funciones asíncronas siempre retornan una promesa. Si el valor retornado dentro de la función no es una promesa, JavaScript automáticamente lo envuelve en una promesa resuelta con ese valor.

Aquí se muestra una función asíncrona básica:

async function miFuncion() {
    return "Hola Mundo";
}

// La función anterior es equivalente a:
/*
function miFuncion() {
    return new Promise((resolve, reject) => resolve("Hola Mundo"));
}
*/

// Imprime: Hola Mundo
miFuncion().then((valor) => console.log(valor));

Operador de espera (await)

El operador await sólo puede ser utilizado dentro de una función async. Este operador hace una pausa en la ejecución de la función hasta que la promesa se resuelva o rechace, luego retorna el resultado de la promesa.

async function miFuncion() {
    // Declarar promesa que se resuelva tras 1 segundo
    let promesa = new Promise((resolve, reject) => {
        setTimeout(() => resolve("Hola Mundo"), 1000)
    });

    let resultado = await promesa; // Espera hasta que la promesa se resuelva

    console.log(resultado); // Imprime: Hola Mundo
}

miFuncion();

En el código anterior, la función miFuncion pausa su ejecución en let resultado = await promesa;, hasta que la promesa se resuelva. Luego la ejecución continúa con console.log(resultado);.

Manejo de errores

Es importante manejar adecuadamente los errores en la programación asíncrona. Para ello se puede utilizar try/catch alrededor de las promesas.

Aquí se muestra un ejemplo:

async function miFuncion() {
    try {
        let promesa = new Promise((resolve, reject) => {
            setTimeout(() => reject("Ha ocurrido un error"), 1000)
        });

        let resultado = await promesa; // Espera hasta que la promesa se resuelva o se rechace

    } catch(error) {
        console.log(error); // Imprime: Ha ocurrido un error
    }
}

miFuncion();

En este código, si la promesa se rechaza, el error es capturado y manejado por el bloque catch.

En resumen, async y await son herramientas poderosas en JavaScript que simplifican el trabajo con operaciones asíncronas, haciendo que el código sea más fácil de leer y escribir.