Promesa de JavaScript y encadenamiento de promesas

Tabla de contenido

Crea una promesa
Encadenamiento de promesas de JavaScript
Promesa de JavaScript versus devolución de llamada
JavaScript Promise Methods

En este tutorial, aprenderá sobre las promesas de JavaScript y el encadenamiento de promesas con la ayuda de ejemplos.

En JavaScript, una promesa es una buena forma de manejar operaciones asincrónicas . Se utiliza para averiguar si la operación asincrónica se completó con éxito o no.

Una promesa puede tener uno de tres estados.

Pendiente
Cumplido
Rechazado

Una promesa comienza en un estado pendiente. Eso significa que el proceso no está completo. Si la operación es exitosa, el proceso finaliza en un estado cumplido. Y, si ocurre un error, el proceso termina en un estado rechazado.

Por ejemplo, cuando solicita datos del servidor mediante una promesa, estará en estado pendiente. Cuando los datos lleguen correctamente, estarán en un estado cumplido. Si ocurre un error, estará en un estado rechazado.

Crea una promesa

Para crear un objeto de promesa, usamos el Promise()constructor.

 let promise = new Promise(function(resolve, reject)( //do something ));

El Promise()constructor toma una función como argumento. La función también acepta dos funciones resolve()y reject().

Si la promesa se devuelve correctamente, resolve()se llama a la función. Y, si ocurre un error, reject()se llama a la función.

Supongamos que el programa siguiente es un programa asincrónico. Entonces el programa se puede manejar usando una promesa.

Ejemplo 1: programa con una promesa

 const count = true; let countValue = new Promise(function (resolve, reject) ( if (count) ( resolve("There is a count value."); ) else ( reject("There is no count value"); ) )); console.log(countValue);

Salida

 Promesa (: "Hay un valor de recuento")

En el programa anterior, Promisese crea un objeto que toma dos funciones: resolve()y reject(). resolve()se usa si el proceso es exitoso y reject()se usa cuando ocurre un error en la promesa.

La promesa se resuelve si el valor de count es verdadero.

Funcionamiento de la promesa de JavaScript

Encadenamiento de promesas de JavaScript

Las promesas son útiles cuando tienes que manejar más de una tarea asincrónica, una tras otra. Para eso, usamos el encadenamiento de promesas.

Puede llevar a cabo una operación después de una promesa se resuelve utilizando métodos then(), catch()y finally().

Método JavaScript then ()

El then()método se utiliza con la devolución de llamada cuando la promesa se cumple o se resuelve correctamente.

La sintaxis del then()método es:

 promiseObject.then(onFulfilled, onRejected);

Ejemplo 2: encadenando la promesa con then ()

 // returns a promise let countValue = new Promise(function (resolve, reject) ( resolve('Promise resolved'); )); // executes when promise is resolved successfully countValue.then( function successValue(result) ( console.log(result); ), ) .then( function successValue1() ( console.log('You can call multiple functions this way.'); ), );

Salida

 Promesa resuelta Puede llamar a varias funciones de esta manera.

En el programa anterior, el then()método se usa para encadenar las funciones a la promesa. Se then()llama al método cuando la promesa se resuelve correctamente.

Puede encadenar varios then()métodos con la promesa.

Método JavaScript catch ()

El catch()método se usa con la devolución de llamada cuando se rechaza la promesa o si se produce un error. Por ejemplo,

 // returns a promise let countValue = new Promise(function (resolve, reject) ( reject('Promise rejected'); )); // executes when promise is resolved successfully countValue.then( function successValue(result) ( console.log(result); ), ) // executes if there is an error .catch( function errorValue(result) ( console.log(result); ) );

Salida

 Promesa rechazada

En el programa anterior, se rechaza la promesa. Y el catch()método se usa con la promesa de manejar el error.

Funcionamiento del encadenamiento de promesas de JavaScript

Promesa de JavaScript versus devolución de llamada

Las promesas son similares a las funciones de devolución de llamada en el sentido de que ambas pueden usarse para manejar tareas asincrónicas.

Las funciones de devolución de llamada de JavaScript también se pueden utilizar para realizar tareas sincrónicas.

Sus diferencias se pueden resumir en los siguientes puntos: