[Javascript] Run asynchronous functions in sequence using reduce

Posted 2022-09-27 answer1215

This can be handy if you have a rate limit on API requests or if you need to pass the result of each promise to the next one. 

function fetchMessages(username) 
    return fetch(`https://example.com/api/messages/$username`)
        .then(response => response.json());


function getUsername(person) 
    return person.username;


async function chainedFetchMessages(p, username) 
    // In this function, p is a promise. We wait for it to finish,
    // then run fetchMessages().
    const obj  = await p;
    const data = await fetchMessages(username);
    return  ...obj, [username]: data;


const msgObj = peopleArr
    .map(getUsername)
    .reduce(chainedFetchMessages, Promise.resolve())
    .then(console.log);
// ? glestrade: [ … ], mholmes: [ … ], iadler: [ … ]