Explique Promise.any() con async-await en JavaScript

En este artículo, intentaremos comprender cómo implementar el método Promise.any() con async-await en JavaScript usando algunas explicaciones teóricas seguidas de algunos ejemplos de codificación también.

En primer lugar, comprendamos rápidamente el funcionamiento del método Promise.any() con algunos ejemplos teóricos (incluida la sintaxis para declarar este método en particular), seguido de un breve ejemplo para una mejor comprensión conceptual.

Funcionamiento del método Promise.any():

• El método Promise.any() es uno de los métodos de objeto Promise más comúnmente utilizados en los que si alguna promesa que se cumple con éxito (que no está en el estado rechazado) será ejecutada por este método en particular.
• El que esté en estado rechazado será rechazado y no será ejecutado por este método. 
• Supongamos que hay cuatro promesas en línea y tres de ellas se cumplen con éxito (es decir, se «resuelve») y una de ellas se rechaza, entonces de estas tres promesas, la que es más rápida se ejecutará primero y las restantes pueden no ser ejecutado por este método.
• El método Promise.any() de alguna manera se comporta de manera similar a como se comporta el método Promise.race(), como en el método Promise.race(), cualquiera que sea la promesa que primero se cumpla (o resuelva) con éxito, solo se ejecutará esa promesa y el resto quedan sin ejecutar.

Sintaxis del método Promise.any(): La siguiente es la sintaxis que podemos usar para implementar el método Promise.any():-

Promise.any([first_promise , second_promise , ...]).then(
    // do something.....
)

Ahora que hemos visto algunas explicaciones teóricas del método Promise.any(), visualicemos rápidamente todos los hechos ilustrados anteriormente usando un ejemplo que es el siguiente:

Ejemplo 1: en este ejemplo, crearemos cuatro promesas, una estará en estado rechazado y las otras tres estarán en estado resuelto. Dentro de todas las promesas resueltas, crearemos funciones de temporizador separadas (funciones setTimeout) con diferentes temporizadores cada una. Luego, usaremos el método Promise.any() que aceptará un objeto iterable (en la mayoría de los casos, se podría preferir o usar una array) que consta de diferentes promesas a la vez. Luego, usando el método then(), intentaremos mostrar el resultado obtenido después de la ejecución de las promesas usando este método en la consola del navegador.

<script>
    let rejected_promise = new Promise(
        (resolve, reject) => reject("Rejected Promise...."));
  
    let first_resolved_promise = new Promise(
        (resolve, reject) => {
            setTimeout(() => {
                resolve("GeeksforGeeks...!!");
            }, 1000);
        });
  
    let second_resolved_promise = new Promise(
        (resolve, reject) => {
            setTimeout(() => {
                resolve("JavaScript......!!");
            }, 2000);
        });
  
    let third_resolved_promise = new Promise(
        (resolve, reject) => {
            setTimeout(() => {
                resolve("TypeScript...!!");
            }, 3000);
        });
  
    let combined_promise = [
        rejected_promise,
        first_resolved_promise,
        second_resolved_promise,
        third_resolved_promise,
    ];
  
    Promise.any(combined_promise)
        .then((result) => console.log(result));
</script>

Producción:

GeeksforGeeks...!!

Ahora que hemos entendido el método Promise.any() con un ejemplo también. Veamos ahora cómo podemos implementar el método Promise.any() con palabras clave async-await usando el siguiente ejemplo ilustrado:

Ejemplo 2: En este ejemplo, crearemos cuatro promesas, como hemos creado en el ejemplo anterior de la misma manera. Luego, implementaremos un método en el que agregaremos la palabra clave asíncrona en el prefijo, lo que indicaría que esta función en particular ahora puede manejar todas las requests asíncronas que le llegan. Luego, crearemos un objeto iterable (una array) que consta de las cuatro promesas dentro de él y buscaremos los datos (la array) dentro de otra variable usando otra palabra clave llamada await que esperará hasta que los datos se completen. Función de aceptación de respuesta. A partir de entonces, usando el método Promise.any(), mostraremos el resultado en la consola del navegador usando los métodos then() y console.log().

<script>
    let rejected_promise = new Promise(
        (resolve, reject) => reject("Rejected Promise...."));
  
    let first_resolved_promise = new Promise(
        (resolve, reject) => {
            setTimeout(() => {
                resolve("GeeksforGeeks...!!");
            }, 1000);
        });
  
    let second_resolved_promise = new Promise(
        (resolve, reject) => {
            setTimeout(() => {
                resolve("JavaScript......!!");
            }, 2000);
        });
  
    let third_resolved_promise = new Promise(
        (resolve, reject) => {
            setTimeout(() => {
                resolve("TypeScript...!!");
            }, 3000);
        });
  
    let combined_promise = [
        rejected_promise,
        first_resolved_promise,
        second_resolved_promise,
        third_resolved_promise,
    ];
  
    async function displayResult() {
        try {
            let promise_array = [
                rejected_promise,
                first_resolved_promise,
                second_resolved_promise,
                third_resolved_promise,
            ];
            let result = await promise_array;
              
            Promise.any(combined_promise)
                .then((result) => console.log(result));
        } catch (error) {
            console.log(error.message);
        }
    }
  
    displayResult();
</script>

Producción:

GeeksforGeeks...!!