On the sticky notes at your tables, respond to one or more of the following at the boards:
- Everything you know about / questions you still have on asynchronous code
- Everything you know about / questions you still have on fetch
- Everything you know about / questions you still have on execution contexts & the call stack
On Your Own
With someone next to you, take turns discussing what you just read.
With Your Partner
Create a diagram similar to the article to demonstrate what happens when we use
fetch. How does
fetch fit in with the code above and below it?
Call Stack and Event Loop
Let’s take a look at snippets of this video that has some great visualizations for the call stack, event loop, and queue.
- 4:15-6:00 (call stack with synchronous functions)
- 6:40 (stack overflow example)
- 7:20-8:50 (imagine if
fetchwere synchronous - we would have to wait for each request to complete before moving on)
- 10:23-11:46 (asynchronous callbacks -
setTimeout, what happens to the
setTimouton the stack?)
- 11:47-14:50 (intro to the event loop)
After this point, the talk is good but gets into a lot of detail.
Check for Understanding
Let’s take this event loop example with
setTimeout and translate it to what we have seen with
fetch and promises. Note that the event loop will wait until the call stack is empty to run the
.then from a fetch call.