Async function returns empty array

Question

I'm trying to create a matrix of some pairs of data. fetchDataPair() is an async function.

async function fetchData(info_array){
    let matrix = []
    for(const i of info_array){
        let row = []
        for (const j of info_array){
            if (i != j){
                let pair = fetchDataPair(i,j)
                row.push(pair)
            }else{
                row.push(null)
            }
        }
        Promise.all(row).then((resolvedRow)=>{ //resolve all the promises in the row, then push to matrix
            matrix.push(resolvedRow)
        })
    }
    //matrix should be an array of arrays of (resolved) promises, but it just returns an empty array
    console.log(matrix) //logs []
    return matrix
}

This code unfortunately seems to reach return matrix before the rows are pushed into the array, but I can't understand why.

Thanks

EDIT: Fixed the name of the inside function from fetchData to fetchDataPair

Bergi · Accepted Answer · 2021-05-21 11:59:53Z

1

//resolve all the promises in the row, then push to matrix

That has exactly the same problem as would waiting for the pair promise resolve and pushing its result to the row array afterwards - you can't do that, you need to create an array of promises and use Promise.all:

function fetchData(info_array) {
    let matrix = []
    for (const i of info_array) {
        let row = []
        for (const j of info_array) {
            if (i != j) {
                let pair = fetchDataPair(i,j)
                row.push(pair)
            } else {
                row.push(null)
            }
        }
        matrix.push(Promise.all(row))
//      ^^^^^^^^^^^^                ^
    }
    return Promise.all(matrix)
//         ^^^^^^^^^^^
}

answered May 21, 2021 at 11:59

Bergi

671k162 gold badges1k silver badges1.5k bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

Hiperfly Over a year ago

By the way I have one question. My goal is to fetch each pair asynchronously, but I have this doubt: Is this fetching each pair on a row asynchronously, then waiting until it gets resolved, and then continuing with the next row? Or is it also doing all the rows asynchronously? Thanks

pzaenger Over a year ago

Out of curiosity: else { row.push(null) } is unnecessary, isn't it?

Bergi Over a year ago

@LeonBrasero This is fetching all pairs concurrently, then waiting for all results. If you want the fetches to be sequential, use await in the loop.

Bergi Over a year ago

@pzaenger No, it's necessary, to ensure that the diagonal of the matrix is filled with null values. If you omitted it, every row would be one item short.

Eduard Hasanaj · Accepted Answer · 2021-05-21 12:11:37Z

0

There are a couple mistakes in the code. The problem is that you need to wait on Promise.all. If you use .then you are subscribing to be notified when it is finished but the execution continues and the console is printed before the promise finishes the execution.

async function fetchData(info_array){
    let matrix = [];
    for(const i of info_array){
        let row = []
        for (const j of info_array){
            if (i != j){
                let pair = fetchData(i,j)
                row.push(pair)
            }
            else {
                row.push(null);
            }
        }

        const rowProc = await Promise.all(row);
        matrix.push(rowProc);
    }
    
    console.log(matrix)
    return matrix
}

edited May 21, 2021 at 12:11

answered May 21, 2021 at 11:56

Eduard Hasanaj

9234 silver badges12 bronze badges

1 Comment

Bergi Over a year ago

This no longer returns a matrix but a flat array, though

Collectives™ on Stack Overflow

Async function returns empty array

2 Answers 2

4 Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

4 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related