¿Cómo funciona la sincronía en promesas en JavaScript?

Autor: | Última modificación: 15 de marzo de 2024 | Tiempo de Lectura: 3 minutos
Temas en este post: ,

Algunos de nuestros reconocimientos:

Premios KeepCoding

En el mundo del desarrollo web, la sincronía en promesas en JavaScript es un tema fundamental que todo programador debe comprender. Cuando se trabaja en aplicaciones web, es común encontrarse con operaciones asíncronas, como la carga de datos desde un servidor o la manipulación de archivos. Aquí es donde las promesas entran en juego, permitiendo que el código se ejecute de manera eficiente y sin bloqueos. En este artículo, exploraremos el funcionamiento de la sincronía en promesas en JavaScript y cómo se relaciona con el event loop y las funciones callback.

¿Qué son las promesas en JavaScript?

Antes de sumergirnos en la sincronía en promesas en JavaScript, es esencial comprender qué son las promesas en este lenguaje. Las promesas son objetos que representan un valor que puede no estar disponible de inmediato, pero que estará disponible en algún momento futuro. Esto es especialmente útil cuando se trata de operaciones asíncronas, como la solicitud de datos a un servidor.

Sincronía en promesas en JavaScript: función callback y event loop

Para entender la sincronía en promesas en JavaScript , es importante conocer dos conceptos fundamentales: la función callback y el event loop.

Función callback

Una función callback es una función que se pasa como argumento a otra función y se ejecuta después de que esa función haya terminado su trabajo. En el contexto de las promesas, las funciones callback se utilizan para manejar el resultado de una promesa cuando esta se resuelve o se rechaza.

Por ejemplo, aquí hay un código que utiliza una función callback para manejar una promesa:

function obtenerDatosDeServidor(callback) { 
setTimeout(function () { 
console.log("Datos obtenidos del servidor."); 
callback(); 
}, 2000); 
} 
obtenerDatosDeServidor(function () { 
console.log("Procesando datos..."); 
});

En este ejemplo, la función obtenerDatosDeServidor toma una función callback como argumento y la ejecuta después de obtener los datos del servidor.

Event loop

El event loop es un concepto esencial en JavaScript que maneja la sincronización de operaciones asíncronas. Cuando se ejecuta un código JavaScript, se coloca en la pila de llamadas (call stack) y se ejecuta de manera sincrónica. Sin embargo, las operaciones asíncronas, como las solicitudes de red o los temporizadores, se colocan en la cola de tareas (task queue) y se ejecutan de manera asíncrona.

El event loop se encarga de mover las tareas de la cola de tareas al stack de llamadas cuando este está vacío. Esto permite que el código asíncrono se ejecute en segundo plano sin bloquear la ejecución del programa.

¿Cómo funciona la sincronía en promesas en JavaScript?

Ahora que tenemos una comprensión básica de las promesas, las funciones callback y el event loop, podemos abordar la sincronía en promesas en JavaScript.

Cuando se crea una promesa, se inicia una operación asíncrona. La ejecución del código continúa, y cuando la operación asíncrona se completa, la promesa se resuelve o se rechaza. Aquí hay un ejemplo de cómo se crea y utiliza una promesa:

function cargarImagen(url) { 
return new Promise(function (resolve, reject) { 
var img = new Image(); 
img.src = url; 
img.onload = function () { 
resolve(img); 
}; 
img.onerror = function () { 
reject(new Error("No se pudo cargar la imagen")); 
}; 
}); 
}

En este ejemplo, la función cargarImagen toma una URL y devuelve una promesa. La promesa se resuelve cuando la imagen se carga con éxito y se rechaza si ocurre algún error.

Ahora, veamos cómo se puede usar esta promesa con una función callback:

cargarImagen("imagen.jpg") 
.then(function (imagen) { 
console.log("Imagen cargada con éxito:", imagen); 
}) 
.catch(function (error) { 
console.error("Error al cargar la imagen:", error); 
});

La función then se utiliza para manejar el resultado exitoso de la promesa, mientras que catch se utiliza para manejar cualquier error que pueda ocurrir.

En resumen, la sincronía en promesas en JavaScript es esencial para trabajar con operaciones asíncronas de manera efectiva. Las promesas permiten manejar tareas asíncronas de manera más ordenada y legible, utilizando funciones callback para manejar los resultados exitosos o los errores.

Es importante comprender el concepto del event loop y cómo se encarga de la sincronización de las operaciones asíncronas en JavaScript.

¿Quieres aprender más?

Si deseas aprender más sobre JavaScript y cómo utilizar promesas de manera efectiva en tu código, considera unirte al Desarrollo Web Full Stack Bootcamp de KeepCoding. En este bootcamp, no solo aprenderás los fundamentos de JavaScript, sino que también adquirirás habilidades avanzadas en desarrollo web que te prepararán para una carrera exitosa en la industria tecnológica. El sector tecnológico ofrece salarios altos y una estabilidad laboral que otros sectores no pueden igualar. ¡No dejes pasar esta oportunidad de cambiar tu vida y unirte a la revolución tecnológica!

Artículos ms leídos

¡CONVOCATORIA ABIERTA!

Desarrollo Web

Full Stack Bootcamp

Clases en Directo | Profesores en Activo | Temario 100% actualizado