How to make result of Promise all in order

Viewed 406

Question: the output of case1 is from 0 to 4 which is in order while the output of case2 is in random.

I know the reason why case1's result is in order is that the request is send after the result of previous request comes. In case2 the request will not wait the result of previous request.

my question is that is there a way to retain the result of case2 in order too?

case1

const main = async () => {
    const arr = Array.of(...[1,2,3,4,5])

    for (let i=0;i<arr.length;i++) {
        console.log(`request:${i}`)
        const res = await request(i)
        console.log(res)
    }


    console.log("next step")

}

const request = (i:number):Promise<number> => {
    return new Promise<number>(((resolve, reject) => {
        setTimeout(()=>{
            resolve(i)
        },Math.random() * 1000)
    }))
}

output1

closure
request:0
0
request:1
1
request:2
2
request:3
3
request:4
4
next step

case2

const main = async () => {
    const arr = Array.of(...[1,2,3,4,5])
    await Promise.all(arr.map(async (v,i) => {
        console.log(`request:${v}`)
        const res = await request(v)
        console.log(`result:${res}`)
        console.log(res)
    })).catch((e) => {

    })


    console.log("next step")

}

const request = (i:number):Promise<number> => {
    return new Promise<number>(((resolve, reject) => {
        setTimeout(()=>{
            resolve(i)
        },Math.random() * 1000)
    }))
}

main()

output2

request:1
request:2
request:3
request:4
request:5
result:4
4
result:5
5
result:1
1
result:3
3
result:2
2
next step

2 Answers

Promise.all() returns an array of the results in the same order; they just won't resolve in order. You could return the response within your request promise, and...

const [result1, result2, result3] = await Promise.all([promise1, promise2, promise3]);

Or if you wanted to iterate over an array...

const results = await Promise.all([promise1, promise2, promise3]);

Promise All should be array of request or promise, in map() should return request. try this

const main =  () => {
    const arr = Array.of(...[1,2,3,4,5])
     Promise.all(arr.map((v,i) => {
        console.log(`request:${v}`)
         return  request(v)   
    })).then((res)=>{
    res.forEach((val)=>{
        console.log(`result:${val}`)
    })
       
    }).catch((e) => {

    })
    console.log("next step")

}

 const request = (i)=> {
     return new Promise((resolve, reject) => {
        setTimeout(()=>{
            resolve(i)
        }, Math.floor(Math.random() * 10)*1000)
    })
} 

main()

Related