JavaScript

JavaScript

Tutorial JavaScript: Promises

JavaScript promises: manejo de asincronía. Domina el manejo de asincronía en JavaScript utilizando promises con ejemplos detallados.

Las promesas en JavaScript son un objeto que representan la terminación o el fracaso eventual de una operación asincrónica. Principalmente, una promesa es un objeto que devuelve un valor que se está procesando pero aún no está listo, es decir, es una forma de manejar operaciones asíncronas.

Creación de promesas

Una promesa se crea mediante el constructor Promise:

let promesa = new Promise(function(resolve, reject) {
  // operación asíncrona
});

Este constructor toma una función como argumento, la cual a su vez acepta dos funciones como argumentos: resolve y reject.

  • resolve es una función que se llama cuando la operación asíncrona se ha completado con éxito. Esta función toma el resultado de la operación como argumento.
  • reject es una función que se llama cuando la operación falla. Esta función toma un objeto Error como argumento que proporciona detalles sobre el error.

Aquí hay un ejemplo:

let promesa = new Promise(function(resolve, reject) {
  let resultado = realizarOperacion(); // una operación cualquiera que puede tardar en completarse

  if (resultado) { // si la operación fue exitosa
    resolve(resultado);
  } else { // si la operación falló
    reject(new Error('La operación falló'));
  }
});

Consumo de promesas

Las promesas se consumen mediante los métodos then, catch y finally de la Promesa:

  • then se usa para especificar las acciones que se deben realizar cuando la Promesa se resuelve exitosamente. Toma una función como argumento, que a su vez acepta el resultado de la operación asíncrona como argumento.
  • catch se usa para manejar cualquier error que ocurra durante la operación. Toma una función como argumento, que a su vez acepta un objeto Error como argumento. Si no se proporciona un catch y sucede un error, el programa lanzará una excepción.
  • finally se usa para especificar las acciones que se deben realizar siempre, independientemente de si la promesa fue resuelta o rechazada. No toma argumentos.
promesa
  .then(function(resultado) {
    console.log('El resultado es:', resultado);
  })
  .catch(function(error) {
    console.error('Ocurrió un error:', error);
  })
  .finally(function() {
    console.log('Operación finalizada');
  });

Encadenamiento de promesas

Es común que se necesite realizar varias operaciones asíncronas consecutivas, donde cada operación depende del resultado de la operación anterior. Para estas situaciones, las Promesas pueden encadenarse. El método then siempre devuelve una nueva promesa, lo que permite encadenar múltiples llamadas then.

let promesa1 = operacionAsincrona1();

promesa1
  .then(function(resultado1) {
    console.log('Resultado 1:', resultado1);
    return operacionAsincrona2(resultado1);  // esta operación devuelve una Promesa
  })
  .then(function(resultado2) {
    console.log('Resultado 2:', resultado2);
    return operacionAsincrona3(resultado2);  // esta operación también devuelve una Promesa
  })
  .then(function(resultado3) {
    console.log('Resultado 3:', resultado3);
  })
  .catch(function(error) {
    console.error('Ocurrió un error:', error);
  });

En este código, operacionAsincrona1, operacionAsincrona2 y operacionAsincrona3 son operaciones asíncronas que devuelven Promesas. El resultado de cada operación se pasa como argumento a la siguiente operación.

Manejo de múltiples promesas en paralelo

A veces, se pueden realizar varias operaciones asíncronas en paralelo y se desea esperar hasta que todas hayan terminado. Para estas situaciones, JavaScript proporciona la función Promise.all. Esta función toma un array de Promesas y devuelve una nueva Promesa que se resuelve cuando todas las Promesas del array se han resuelto. Si alguna de las Promesas del array es rechazada, entonces la Promesa devuelta por Promise.all también es rechazada.

let promesa1 = operacionAsincrona1();
let promesa2 = operacionAsincrona2();
let promesa3 = operacionAsincrona3();

Promise.all([promesa1, promesa2, promesa3])
  .then(function(resultados) {
    console.log('Todos los resultados:', resultados);
  })
  .catch(function(error) {
    console.error('Ocurrió un error:', error);
  });

En este código, operacionAsincrona1, operacionAsincrona2 y operacionAsincrona3 son operaciones que se realizan en paralelo. Los resultados de estas operaciones se reciben en el mismo orden en que las Promesas se pasaron a Promise.all.

Certifícate en JavaScript con CertiDevs PLUS

Ejercicios de esta lección Promises

Evalúa tus conocimientos de esta lección Promises con nuestros retos de programación de tipo Test, Puzzle, Código y Proyecto con VSCode, guiados por IA.

Funciones flecha

JavaScript
Puzzle

Polimorfismo

JavaScript
Test

Array

JavaScript
Código

Transformación con map()

JavaScript
Test

Introducción a JavaScript

JavaScript
Test

Gestor de tareas con JavaScript

JavaScript
Proyecto

Manipulación DOM

JavaScript
Test

Funciones

JavaScript
Test

Funciones flecha

JavaScript
Código

Async / Await

JavaScript
Código

Creación y uso de variables

JavaScript
Test

Excepciones

JavaScript
Puzzle

Promises

JavaScript
Código

Funciones cierre (closure)

JavaScript
Test

Herencia

JavaScript
Puzzle

Herencia

JavaScript
Test

Estructuras de control

JavaScript
Código

Selección de elementos DOM

JavaScript
Test

Modificación de elementos DOM

JavaScript
Test

Filtrado con filter() y find()

JavaScript
Test

Funciones cierre (closure)

JavaScript
Puzzle

Funciones

JavaScript
Puzzle

Mapas con Map

JavaScript
Test

Reducción con reduce()

JavaScript
Test

Callbacks

JavaScript
Puzzle

Manipulación DOM

JavaScript
Puzzle

Promises

JavaScript
Test

Async / Await

JavaScript
Test

Eventos del DOM

JavaScript
Puzzle

Async / Await

JavaScript
Puzzle

Promises

JavaScript
Puzzle

Filtrado con filter() y find()

JavaScript
Código

Callbacks

JavaScript
Test

Creación de clases y objetos Restaurante

JavaScript
Código

Reducción con reduce()

JavaScript
Código

Filtrado con filter() y find()

JavaScript
Puzzle

Reducción con reduce()

JavaScript
Puzzle

Conjuntos con Set

JavaScript
Puzzle

Herencia de clases

JavaScript
Código

Eventos del DOM

JavaScript
Test

Clases y objetos

JavaScript
Puzzle

Modificación de elementos DOM

JavaScript
Puzzle

Mapas con Map

JavaScript
Puzzle

Funciones

JavaScript
Código

Tipos de datos

JavaScript
Test

Clases y objetos

JavaScript
Test

Array

JavaScript
Test

Conjuntos con Set

JavaScript
Test

Array

JavaScript
Puzzle

Encapsulación

JavaScript
Puzzle

Clases y objetos

JavaScript
Código

Uso de operadores

JavaScript
Puzzle

Uso de operadores

JavaScript
Test

Estructuras de control

JavaScript
Test

Excepciones

JavaScript
Test

Transformación con map()

JavaScript
Puzzle

Funciones flecha

JavaScript
Test

Selección de elementos DOM

JavaScript
Puzzle

Encapsulación

JavaScript
Test

Mapas con Map

JavaScript
Código

Creación y uso de variables

JavaScript
Puzzle

Polimorfismo

JavaScript
Puzzle

Tipos de datos

JavaScript
Puzzle

Estructuras de control

JavaScript
Puzzle

Todas las lecciones de JavaScript

Accede a todas las lecciones de JavaScript y aprende con ejemplos prácticos de código y ejercicios de programación con IDE web sin instalar nada.

Certificados de superación de JavaScript

Supera todos los ejercicios de programación del curso de JavaScript y obtén certificados de superación para mejorar tu currículum y tu empleabilidad.

En esta lección

Objetivos de aprendizaje de esta lección

  1. Entender el concepto de promesas en JavaScript y su utilidad para operaciones asincrónicas.
  2. Aprender a crear promesas utilizando el constructor Promise.
  3. Conocer los métodos then, catch y finally para consumir y manejar el resultado de las promesas.
  4. Familiarizarse con el encadenamiento de promesas para realizar operaciones asincrónicas en secuencia.
  5. Aprender a manejar múltiples promesas en paralelo utilizando Promise.all.
  6. Entender cómo las promesas mejoran la legibilidad y estructura del código en situaciones con operaciones asíncronas.