Heads up! To view this whole video, sign in with your Courses account or enroll in your free 7-day trial. Sign In Enroll
Well done!
You have completed Asynchronous Programming with JavaScript!

- 2x 2x
- 1.75x 1.75x
- 1.5x 1.5x
- 1.25x 1.25x
- 1.1x 1.1x
- 1x 1x
- 0.75x 0.75x
- 0.5x 0.5x
JavaScript promises provide an efficient way to fire off and keep track of multiple asynchronous operations with the Promise.all
method. Promise.all
is useful when your program needs to wait for more than one promise to resolve.
Alternative solutions
Using forEach()
Below is another way you could write the generateHTML
function using the forEach
array iteration method.
forEach()
executes its callback function once for each array element, whereas map()
does the same but creates a new array with the results of executing its callback on every item in the original array.
function generateHTML(data) {
data.forEach( person => {
const section = document.createElement('section');
peopleList.appendChild(section);
// Check if request returns a 'standard' page from Wiki
if (person.type === 'standard') {
section.innerHTML = `
<img src=${person.thumbnail.source}>
<h2>${person.title}</h2>
<p>${person.description}</p>
<p>${person.extract}</p>
`;
} else {
section.innerHTML = `
<img src="img/profile.jpg" alt="ocean clouds seen from space">
<h2>${person.title}</h2>
<p>Results unavailable for ${person.title}</p>
${person.extract_html}
`;
}
});
}
Promise.all()
Below is another way you might define a list of promises, and execute other tasks when they are all resolved:
const func1 = getJSON('...');
const func2 = getJSON('...');
Promise.all([func1, func2])
.then(results => {
console.log('Array of results', results);
})
.catch(error => {
console.error(error);
})
Resources
Related Discussions
Have questions about this video? Start a discussion with the community and Treehouse staff.
Sign up-
Adrian Kritzinger
Front End Web Development Techdegree Graduate 12,948 PointsThe json data does not work, I need help finding a solution?
1 Answer
-
Peter Glover
8,826 Points1 Answer
-
Amy Preci
6,247 PointsWiki links return 404, no page exists for some names in the JSON data. Therefore getting rejected promises, how to fix?
Posted by Amy PreciAmy Preci
6,247 Points1 Answer
-
Samuel Kleos
Front End Web Development Techdegree Student 13,728 Points1 Answer
-
Samuel Kleos
Front End Web Development Techdegree Student 13,728 Points1 Answer
-
Armend Azemi
27,921 PointsMy solution for when the search results are ambiguous.
Posted by Armend AzemiArmend Azemi
27,921 Points1 Answer
-
Martha Nakkazi
Front End Web Development Techdegree Graduate 13,238 Points1 Answer
-
Emi Krause
10,918 Points1 Answer
-
karan Badhwar
Web Development Techdegree Graduate 18,135 Points0 Answers
-
Daniel Ahn
Front End Web Development Techdegree Student 8,575 Points1 Answer
-
Yeukai Patience Shiripinda
8,067 Points2 Answers
-
Kris Wertman
4,922 Points2 Answers
-
MSM KSD14
270 PointsI feel very much overwhelmed now. I can understand but so difficult to follow this section of promises.
Posted by MSM KSD14MSM KSD14
270 Points8 Answers
-
Soheb Vahora
9,229 PointsTypeError: Cannot read property 'source' of undefined - I think it's one of the astronauts profile picture.
Posted by Soheb VahoraSoheb Vahora
9,229 Points2 Answers
-
Brendan Moran
14,052 Points0 Answers
-
Georg Ekeberg
5,702 Points4 Answers
View all discussions for this video
Related Discussions
Have questions about this video? Start a discussion with the community and Treehouse staff.
Sign up
You need to sign up for Treehouse in order to download course files.
Sign upYou need to sign up for Treehouse in order to set up Workspace
Sign up