EXAMPLE OF PROMISE.ALL()

Example of Promise.all()

Do you need to iterate over an array of promises? Promise.all() is often the best way.

Promise.all(iterable) returns a single promise.

Promise.all(iterable) only resolves after every promise in an array of promises has completed resolving. Since the elements of the array are promises, they do not resolve in any particular order.

If there is an error in any of the promises in the array of promises, then promise.all will abort and the error will bubble up to the .catch method.

Promise.all example

Often the array of promises pass to promise.all() is built using .map(someCallbackfunction) and results in a new array. The map methon on the original array does not alter the original array. Learn more about the array.map(callback) method here.

artDataPromises is a new array containing the promises as a result of the original paintingTitles array being mapped with the getArtData(paintingTitle) function.

getArtData(paintingTitle) is a function that takes each array element as a parameter and returns a promise of the art data related to that painting title.

Promise.all(artDataPromises) does not resolve until all the promises contained in artDataPromises have first resolved.


// An array of paintings
var paintingTitles = ['The Kiss', 'Fallen Oak', 'Evening Splash']; 

// Map painting titles to an array of promises
var artDataPromises = paintingTitles.map(getArtData); 

// Resolving all promises
Promise.all(artDataPromises)
    .then(function(resolvedArtData) { 
        console.log('resolvedArtData', resolvedArtData);
    })
    .catch(function(err) { 
        console.log("Error fetching art data: " + err);
    });

// Function to return a promise for fetching art data
function getArtData(artTitle) { 
    return new Promise(function(resolve, reject) { 
        // ... get the data ...
        // In a real scenario, resolve or reject should be called based on data fetching logic
    })
    .then(function(theData) { 
        return theData; 
    })
    .catch(function(err) { 
        console.log('ERROR:getArtData', err);
    });
}

Leave a Reply

Your email address will not be published. Required fields are marked *