JavaScript asíncrono

Callbacks

Un callback es una función que se pasa como argumento a otra función, que luego se ejecuta tras la finalización de una operación.

Ejemplo de una Función Callback

function fetchData(callback) {
  setTimeout(() => {
    console.log("Data fetched");
    callback();
  }, 2000);
}
  
function processData() {
  console.log("Processing data...");
}
  
fetchData(processData);

fetchData simula una operación asíncrona utilizando setTimeout.

processData se ejecuta después de que fetchData finaliza.

Promesas

Una promesa representa un valor futuro y tiene tres estados:

1. Pendiente – Estado inicial, operación en progreso.

2. Cumplida – Operación completada con éxito.

3. Rechazada – Operación fallida.

Creando una Promesa

let fetchData = new Promise((resolve, reject) => {
  setTimeout(() => {
    let success = true; // Change to false to test rejection
    if (success) {
      resolve("Data received");
        } else {
      reject("Error fetching data");
    }
  }, 2000);
});
  
fetchData
  .then(result => console.log(result)) // Executes if resolved
  .catch(error => console.log(error)) // Executes if rejected
.finally(() => console.log("Operation complete"));

.then() se ejecuta cuando la promesa se resuelve.

.catch() se ejecuta cuando la promesa es rechazada.

.finally() se ejecuta independientemente del éxito o fracaso.

Conclusión

La programación asíncrona permite a JavaScript manejar operaciones que consumen tiempo de manera eficiente. Los callbacks, las promesas y async/await ayudan a gestionar flujos de trabajo asíncronos. La próxima sección explorará manipulación del DOM, que permite a JavaScript interactuar dinámicamente con las páginas web.