Lines inside the displayCatInfo() function

MDN Learn
#1

Why are the para1.textContent = motherInfo; and para2.textContent = kittenInfo; lines inside the displayCatInfo() function, and not at the end of the script?

#2

Hi @samuelharold327

The fetch() method is asynchronous which means that the browser doesn’t wait for the result, but continues with the rest of the code. The displayCatInfo() function only get called when the results from fetch() arrive. Inside this function the two variables motherInfo and kittenInfo get their content.
If the two line were outside the function the order would be:

  • fetch() gets called
  • The two line assign the original strings to para1 and para2
  • Results arrive and displayCatInfo() gets called
  • motherInfo and kittenInfo receive their content, but aren’t assigned to the paragraphs (since this happened before)

Does that make it clear?

Have a nice day,
Michael

1 Like
#3

sangat jelas. terimasih :grinning:

1 Like