This course has been updated! We now recommend you take the JavaScript: The Hard Parts, v2 course.

Check out a free preview of the full JavaScript: The Hard Parts course:
The "Callback Queue & Event Loop" Lesson is part of the full, JavaScript: The Hard Parts course featured in this preview video. Here's what you'd learn in this lesson:

Will reviews the Callback Queue and Event Loop that concern the execution of asynchronously delayed code.

Get Unlimited Access Now

Transcript from the "Callback Queue & Event Loop" Lesson

>> Because we're interacting with the outside world, we have to add two strict rules. We have two rules for the execution of our asynchroneously delayed code. Print hello, is asynchroneously delayed. It's saying, we're gonna delay this code and run it later. That asynchronicity is not happening in JavaScript.

[00:00:18] JavaScript has one thread so it can't Add the function to the Queup stack in other words execute that function only when the Queup stack is totally empty. So what is that process called if the cheque is the Queup stack empty and is that the callback Queup that process is known as something called has come from your side in general standard compute science concept Where you're checking is something empty in order to pass some functionality to be run.

[00:01:10] It's called an event loop. The event loop is just the process of going, hold on. Is my call stack empty? Does my callback queue have a function in it? Don't worry. Call stack was not empty, was not empty, check, check, check, check, check. Still not empty, block for one second is on the way.

[00:01:33] Check, check, still not empty. Still block one, aha, don't panic. Now the call stack's empty, block for one second has finished executing. I can add print hello's call to my call stack. Hooray. The event loop is just a posh name for that checking is my call stack empty?

[00:01:53] Well if it is I can add my callback function that was deferred from using this built in set time out that speaks in the web browser API's. Stores a reference of that function. And on completion of my API, completes instantly. Pushes that function, to the call back queue, where it waits ready to go back to the call stack, when the event loop says it is okay.

[00:02:19] And it was, it was okay. Because we went back to global, and at that moment the event loop said, take that print hello function! And push it to the call stack where it can be run in conventional JavaScript land. But didn't it take awhile to get back into that world, to go over 1,000 milliseconds?

[00:02:40] Even though the function printHello looked like it was only gonna be deferred for 0 milliseconds, it took over 1,000 milliseconds. All right folks. We're gonna have to look at one more API like this. Besides timer, there's a whole bunch of different API's we can use. Timer and whole bunch of other ones.

[00:03:01] We're gonna look at one more after some more pairing. But first, thumbs and clarification questions on this addition of our two final pieces. Of the JavaScript platform at event loop, and our callback Hugh, or our message or task Hugh. These are messages, tasks that are gonna be passed back to JavaScript's call stack only when the event loop says you're good to go, it's clear