ES11: Promise.allSettled

Por si alguien más tenía la duda.

“resolve” y “reject” no son palabras reservadas (pero sí comúnmente usadas en la sintaxis de una promesa. Se puede usar cualquier nombre como:

new Promise((simon, nel ) => (true) ? simon() : nel())

Tambien existe

Promise.all()

El método Promise.all(iterable) devuelve una promesa que termina correctamente cuando todas las promesas en el argumento iterable han sido concluídas con éxito, o bien rechaza la petición con el motivo pasado por la primera promesa que es rechazada. MDN (https://developer.mozilla.org/es/docs/Web/JavaScript/Reference/Global_Objects/Promise/all)

La diferencia con

Promise.allSettled()

Ejecuta todas las promesas sin importar si son rechazadas o no.

Hola Chic@s

**ES11: **

• Promise.allSettled

const promise1 = new Promise((resolve, reject) => reject("reject"));
const promise2 = new Promise((resolve, reject) => resolve("resolve"));
const promise3 = new Promise((resolve, reject) => resolve("resolve2"));

Promise.allSettled([promise1, promise2, promise3])
.then(response => console.log(response));

El método Promise.allSettled() devuelve una promesa que se cumple después de que todas las promesas dadas se hayan cumplido o rechazado, con una matriz de objetos que describen el resultado de cada promesa.

Por lo general, se usa cuando tiene varias tareas asincrónicas que no dependen unas de otras para completarse correctamente, o si siempre desea saber el resultado de cada promesa.

En comparación, la Promesa devuelta por Promise.all() puede ser más apropiada si las tareas dependen unas de otras/si desea rechazar inmediatamente cualquiera de ellas

Es dificil entender estos conceptos sin un contexto, lastimosamente hay que complementar estas clases con videos de youtube donde si explican los conceptos dando ejemplos practicos

Si no les quedo claro, aqui les dejo un video que lo explica.
Duración aproximada 1min
https://youtube.com/shorts/0BeOn_WSaN0?feature=share

si desean ver la información de una manera distinta a la del profe podemos utilizar console.table, la cual nos dará la información mas organizada, mostrándonos igual el resultado de la promesa, la razón, y el valor de las que fueron resueltas, espero les sirva, (no es mucho pero es trabajo honesto XD)

Todo quedó más claro leyendo la explicación que está en la sección de recursos

Fulfilled significa “Cumplido”

Mi código para este curso.

/*El método Promise.all sirve para manejar varias promesas al mismo tiempo. Recibe como argumento un
 array de promesas. Promise.all() se resolverá, si y solo si todas las promesas fueron resueltas. 
 Si al menos una promesa es rechazada, Promise.all será rechazada. */
{
  const promise1 = new Promise((resolve, reject) => reject("Rechazada"));
  const promise2 = new Promise((resolve, reject) => resolve("Resuelta 2"));
  const promise3 = new Promise((resolve, reject) => resolve("Resuelta 3"));

  Promise.all([promise1, promise2, promise3])
    .then(respuesta => console.log(respuesta))
    .catch(error => console.log(error));
  
  // Sí todas las promesas se cumplen, se ejecuta el metodo then() y el parametro respuesta es un array:
  ['resuelta 1', 'Resuelta 2', 'Resuelta 3'];

  //Sí al menos una es rechazada, se ejecuta el metodo catch y el parametro error es un string
  "Rechazada";
}

/*Promise.allSettled() permite manejar varias promesas, que devolverá un array de objetos con el
estado y el valor de cada promesa, haya sido resuelta o rechazada. */

{
  const promesa1 = Promise.reject("Ups promesa 1 falló");
  const promesa2 = Promise.resolve("Promesa 2 sí cumplió");
  const promesa3 = Promise.reject("Ups promesa 3 falló");

  Promise.allSettled([promesa1, promesa2, promesa3])
    .then(respuesta => console.log(respuesta));
  
  //El resultado, se ejecuta el metodo then() y el parametro respuesta sería este array:
  [
    { status: 'rejected', reason: 'Ups promesa 1 falló' },
    { status: 'fulfilled', value: 'Promesa 2 sí cumplió' },
    { status: 'rejected', reason: 'Ups promesa 3 falló' }
  ];
}

Link a la documentación oficial sobre Promise.allSettled()

28/35 ES11: Promise.allSettled
Cuando necesitas manejar varias promesas al mismo tiempo y obtener sus resultados, puede utilizar los métodos Promise.all y Promise.allSettled

Promise.all toma un array de promesas como argumento y se resolverá solo si todas las promesas en el array son resueltas. Si al menos una primesa es rechazada, Promise.all se rechazará. Por ejemplo:

Promise.all([
  fetch('https://api.example.com/data1'),
  fetch('https://api.example.com/data2'),
  fetch('https://api.example.com/data3')
]).then(respuesta => {
  console.log(respuesta[0]); // respuesta de la primera promesa
  console.log(respuesta[1]); // respuesta de la segunda promesa
  console.log(respuesta[2]); // respuesta de la tercera promesa
}).catch(error => {
  console.log(error); // si al menos una promesa fue rechazada
});

Por otro lado, Promise.allSettled toma un array de promesas como argumento y devolverá un array de objetos que contiene el estado y el valor de cada promesa, independientemente de si fue resuelta o rechazada. Por ejemplo:

const promesa1 = Promise.reject("Ups promesa 1 falló");
const promesa2 = Promise.resolve("Promesa 2");
const promesa3 = Promise.reject("Ups promesa 3 falló");

Promise.allSettled([promesa1, promesa2, promesa3])
  .then(respuesta => {
    console.log(respuesta[0]); // estado y razón de la promesa 1
    console.log(respuesta[1]); // estado y valor de la promesa 2
    console.log(respuesta[2]); // estado y razón de la promesa 3
  });

ES11: Promise.allSettled

En ECMAScript 2020 (ES11), se introdujo el método Promise.allSettled(), que en español se traduce como “Promise.allSettled()”. Esta adición es una extensión de la funcionalidad de las promesas en JavaScript y proporciona una forma de trabajar con múltiples promesas de manera más robusta, permitiendo que todas las promesas se resuelvan o rechacen sin interrumpir el flujo de ejecución.

Antes de Promise.allSettled(), la función Promise.all() se usaba para manejar un arreglo de promesas y esperar a que todas se resolvieran o al menos una se rechazara. Sin embargo, si una de las promesas se rechazaba, el método Promise.all() terminaba inmediatamente y no proporcionaba información sobre las promesas individuales.

Con Promise.allSettled(), puedes esperar a que todas las promesas se resuelvan o se rechacen, y obtendrás una matriz de resultados que indica el estado final de cada promesa, ya sea resuelta o rechazada, junto con el valor o motivo asociado.

Aquí tienes un ejemplo de cómo usar Promise.allSettled():

const promesa1 = Promise.resolve('Éxito');
const promesa2 = Promise.reject('Error');
const promesa3 = new Promise(resolve => setTimeout(resolve, 100, 'Tiempo agotado'));

Promise.allSettled([promesa1, promesa2, promesa3])
  .then(resultados => {
    console.log(resultados);
  });

En este ejemplo, las tres promesas tienen diferentes resultados:

• promesa1 se resuelve con el valor ‘Éxito’.
• promesa2 se rechaza con el motivo ‘Error’.
• promesa3 se resuelve después de un retraso de 100 ms con el valor ‘Tiempo agotado’.
  
  La salida del código será:

[
  { status: 'fulfilled', value: 'Éxito' },
  { status: 'rejected', reason: 'Error' },
  { status: 'fulfilled', value: 'Tiempo agotado' }
]

El método Promise.allSettled() te permite obtener información detallada sobre el estado y los resultados de todas las promesas en el arreglo, lo que puede ser útil para manejar diferentes casos de resolución y rechazo en un contexto asincrónico.

Espero sea de utilidad. 👨‍💻

para ver como Promise “espera” el resultado de las promises mientras prosigue el flujo

const promise = new Promise((resolve, reject) => {
    (true)
    ?setTimeout(() => resolve("desde alguna API..."), 5000)
    :reject(new Error("Error!")); 
});
const promise1 = new Promise((resolve, reject ) => reject("Reject1"));
const promise2 = new Promise((resolve, reject ) => resolve("OK1"));
const promise3 = new Promise((resolve, reject ) => reject("Reject2"));

console.log("Before");
Promise.allSettled([promise, promise1, promise2, promise3])
    .then(response=>console.log(response));

console.log(promise);
console.log(promise1);
console.log(promise2);
console.log(promise3);
console.log("After");```

El método promise.allSettled() devuelve una promesa que es resuelta después de que todas las promesas dadas hayan sido concluidas, sin importar si fueron resueltas o rechazadas. El resultado va a ser una serie de objetos describiendo el resultado de cada promesa.

const p1 = new Promise((resolve, reject) => resolve("✅"));
const p2 = new Promise((resolve, reject) => reject("❌"));
const p3 = new Promise((resolve, reject) => resolve("✅"));

Promise.allSettled([p1, p2, p3])
	.then(response => console.log(response))
	.catch(error => console.log(error));

/*

0: {status: "fulfilled", value: "✅"}
1: {status: "rejected", reason: "❌"}
2: {status: "fulfilled", value: "✅"}

*/

Para cada resultado hay un status (estado). Si el estado es fulfilled, es porque la promesa se resolvió correctamente y tenemos value. Si el estado es rejected, es porque la promesa se rechazó y tenemos  reason.

----------------------- Apuntes 🍎 -------------------------
Promise.allSettled() 🚀

Es un método estático que toma un iterable de promesas como entrada y devuelve un solo Promise. Esta promesa devuelta se cumple cuando todas las promesas de la entrada se resuelven (incluso cuando se pasa un iterable vacío), con una serie de objetos que describen el resultado de cada promesa.

const promise1 = new Promise((reject,resolve) => reject("Reject"));
const promise2 = new Promise((reject,resolve) => resolve("resolve"));
const promise3 = new Promise((reject,resolve) => resolve("resolve 2"));

Promise.allSettled([promise1,promise2,promise3])
    .then(response => console.log(response));

//ejemplo

const promise1 = Promise.resolve(3);
const promise2 = new Promise((resolve, reject) => setTimeout(reject, 100, 'foo'));
const promises = [promise1, promise2];

Promise.allSettled(promises).then((results) => results.forEach((result) => console.log(result.status)));

// Expected output:
// "fulfilled"
// "rejected"

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise/allSettled

alguien mas le quedo una duda en esta clase?, pienso la explicación fue muy corta.
Otra vez tendré que investigar por mi cuenta.

Promise.allSettled().- Maneja varias promesas a la vez (promesas que recibe en un array como argumento), y devuelve un array de objetos con la información: estado y valor de cada promesa evaluada, tanto si esta fue resuelta o rechazada.

💻 Archivos del Proyecto 💻

Pasos 📌

• • Dentro de la carpeta es11, crear el archivo llamado: 03-promise-allsettled.js
  • • ◦ El código queda:

//Compilar: seleccionar el código + click derecho + Run Code

//Ejercicio #1
const promise1 = new Promise((resolve, reject) => reject("reject"));
const promise2 = new Promise((resolve, reject) => resolve("resolve"));
const promise3 = new Promise((resolve, reject) => resolve("resolve 2"));

Promise.allSettled([promise1, promise2, promise3])
.then(response => console.log(response));

/*output: muestra un status por cada promise, fulfilled indica que fue completada
[
{ status: 'rejected', reason: 'reject' },
{ status: 'fulfilled', value: 'resolve' },
{ status: 'fulfilled', value: 'resolve 2' }
]
*/

Ejecutar todas las promesas :0

La respuesta es un callback, no son palabras reservadas

    const anotherFunction = () => {
    return new Promise((simon, nel ) => (true) ? simon("jalo") : nel("no jalo"))
    }

    anotherFunction()
    .then(dice => console.log(dice))

Mi resumen:

Cada que hay una nueva clase que habla de asíncronismo y aún no llevas el curso de eso.

// allSettled (Todo resuelto)
// Nos permite saber si nuestra promesa ha sido terminado(Ya sea resuelta o rechazada)

const promise1 = new Promise((resolve, reject) => reject("reject"));
const promise2 = new Promise((resolve, reject) => resolve("resolve"));
const promise3 = new Promise((resolve, reject) => resolve("resolve2"));

Promise.allSettled([promise1, promise2, promise3])
.then(response => console.log(response));

// [
//     { status: 'rejected', reason: 'reject' },
//     { status: 'fulfilled', value: 'resolve' },
//     { status: 'fulfilled', value: 'resolve2' }
//   ]
  

En JavaScript, la función Promise.allSettled es un método estático de la clase Promise que se introdujo en ECMAScript 11 (también conocido como ECMAScript 2021). Este método permite esperar a que todas las promesas hayan sido completadas o rechazadas antes de continuar con el código siguiente.

Promise.allSettled difiere de Promise.allen que Promise.all espera que todas las promesas se completen exitosamente antes de continuar, mientras que Promise.allSettled permite continuar incluso si algunas de las promesas se rechazan.

Aquí hay un ejemplo de cómo se puede usar Promise.allSettled en JavaScript:

const promise1 = new Promise((resolve, reject) => {
  setTimeout(() => {
    resolve('Promise 1 resolved');
  }, 1000);
});

const promise2 = new Promise((resolve, reject) => {
  setTimeout(() => {
    reject('Promise 2 rejected');
  }, 500);
});

Promise.allSettled([promise1, promise2]).then((results) => {
  console.log(results);
  /* Output:
    [
      { status: 'fulfilled', value: 'Promise 1 resolved' },
      { status: 'rejected', reason: 'Promise 2 rejected' }
    ]
  */
});

En este ejemplo, ambas promesas son esperadas por Promise.allSettled antes de continuar con el código siguiente. Aunque promise2 es rechazada, Promise.allSettled permite continuar y devuelve un objeto con los resultados de cada promesa en forma de una matriz de objetos. Cada objeto tiene un estado (fulfilled o rejected) y un valor (value o reason).

Me encontre con un detalle muy curioso.
Ejecute tanto ...allSettled() como ...all().

Pero me percate de que al hacer console.log, sin importar el orden en que ejecute el all o allSettled los catch siempre son procesados despues de los then dentro del callstack de JavaScript.

Apunte

Aunque no es tan necesario.