¿Cómo trabajas con JavaScript asíncrono?

Trabajo con asincronía en JavaScript utilizando callbacks, promesas y async/await.

Callbacks son funciones que se pasan a otras funciones como argumentos y se ejecutan después de completar alguna operación. Pueden llevar a "infiernos de callbacks" cuando hay anidamiento.

// Ejemplo de callback
function fetchData(callback) {
  setTimeout(() => {
    callback("Datos recibidos");
  }, 1000);
}

fetchData((data) => {
  console.log(data); // Mostrará "Datos recibidos" después de 1 segundo
});

Las promesas son objetos que representan la finalización o fallo de una operación asíncrona. Facilitan el trabajo con código asíncrono, evitando anidamientos profundos. Tienen tres estados: pending (pendiente), fulfilled (cumplida), rejected (rechazada).

// Ejemplo de promesa
function fetchDataPromise() {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      resolve("Datos recibidos");
    }, 1000);
  });
}

fetchDataPromise()
  .then((data) => {
    console.log(data); // Mostrará "Datos recibidos" después de 1 segundo
  })
  .catch((error) => {
    console.error("Error:", error);
  });

Async/await es azúcar sintáctico sobre promesas que hace que el código asíncrono sea más legible, parecido al síncrono. Una función marcada con async siempre devuelve una promesa. El operador await solo puede usarse dentro de funciones async y pausa la ejecución hasta que la promesa se resuelva o rechace.

// Ejemplo de async/await
async function fetchDataAsync() {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      resolve("Datos recibidos");
    }, 1000);
  });
}

async function processData() {
  try {
    const data = await fetchDataAsync();
    console.log(data); // Mostrará "Datos recibidos" después de 1 segundo
  } catch (error) {
    console.error("Error:", error);
  }
}

processData();

Frecuentemente uso async/await al trabajar con solicitudes API, ya que es la forma más cómoda y legible de manejar operaciones asíncronas. Para ejecución paralela de varias operaciones asíncronas, utilizo Promise.all() o Promise.allSettled().

Utilizo el event loop para entender el orden de ejecución del código asíncrono, microtareas y macrotareas.