Fetch is human friendly?

[GenesisMauries]

Tengo un problemas con la siguiente función y no he logrado resolverlo.
Espero que esta función devuelva un array de objetos con la respuesta de la promesa pero se repite el resultado algunas veces mas.

[fabian]

Hola @GenesisMauries,

El problema que tienes es con el momento en el que ocurren las cosas más que con fetch. Como sabes fetch es asíncrono, esto significa que hace las cosas a medida que pasan, no linea a linea o secuencial como pensamos o como ocurre con todas las lineas de código que tienes.
De todas maneras no hay que desesperar, hay muchas maneras de controlar lo que va pasando de una manera más secuencial, pero es usando promesas en todo su esplendor, así que vamos viendo con paciencia cada paso a continuación :

1. Necesitamos concentrar todas las promesas de los fetch, recordemos que aparte de que es asíncrono, fetch retorna una promesa :

   let fetchPromises = results.map( result => fetch(result) );

2. Luego, como no nos importa qué fetch se haga primero o después, solo necesitamos que se ejecuten y recibir los resultados una vez que todos terminen, podemos hacer eso con promesas de la siguiente forma :

   let allFetchsTogether = Promise.all(fetchPromises);

3. Ahora necesitamos procesar los resultados de hacer todos los fetch, Promise.all es también una promesa, así que esperamos su resultado en su then :

    allFetchsTogether.then(fetchsResult => {
        return fetchsResult.map(result => {
            href : result.url,
            status : result.status,
            text : result.statusText //Creo que esto lo tienes equivocado 
        })
    }); 

4. ¿Pero donde entonces recibimos el resultado? el return pertenece al then de la promesa, no podemos retornar en la función runArray dada la naturaleza asíncrona de las operaciones que estamos haciendo, por lo que dos alternativas posibles salen : La primera es simplemente retornar la promesa, que quien usa nuestra función la reciba y haga después el then respectivo para poder sacar los resultados. La segunda es a través de callbacks (pero queda feo, y las promesas llegaron para solucionar eso).

Algo a considerar sobre retornar promesas, es que incluso operar una promesa tal como lo hicimos con allFetchsTogether que ya tiene su then, también es una promesa. Veamos un ejemplo :

//supongamos que en runArray retornamos lo que vimos arriba de esta forma : 
    return allFetchsTogether.then(fetchsResult => {
        return fetchsResult.map(result => {
            href : result.url,
            status : result.status,
            text : result.statusText //Creo que esto lo tienes equivocado 
        })
    }); 

//Entonces desde el otro lado, cuando ejecutamos runArray podemos extraer los resultados de la siguiente forma
runArray(someResults).then(processedList => {
    //Acá podemos operar con el resultado de correr runArray.
    //Tener en cuenta que este resultado es lo que retornó el último then de la promesa retornada, 
    //o, si no habían then, el resultado de la promesa.
})

Salió un poco largo, pero espero que haya quedado claro como se resuelve el “retornar” desde una función cosas que son asíncronas.