Search code examples
javascriptpromisees6-promise

How to make result of Promise all in order


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


Solution

  • 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]);