Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.
Lære The Event Loop in Action | Foundations of Asynchronous JavaScript
Asynchronous JavaScript Explained

bookThe Event Loop in Action

To understand how JavaScript handles multiple tasks without running them all at once, you need to know about the event loop. The event loop is a core part of JavaScript's concurrency model. JavaScript runs in a single thread, which means it can only execute one task at a time. However, web applications often need to perform actions like waiting for user input, making network requests, or running timers—these should not block other code from running. The event loop is the mechanism that allows JavaScript to appear to do many things at once, by managing the execution of synchronous code and deferring asynchronous tasks until the main thread is free.

script.js

script.js

index.html

index.html

copy

In this code sample, you see three statements: a console.log for "Start", a setTimeout with a callback, and a console.log for "End". When this code runs, "Start" is printed first. The setTimeout schedules its callback to run after a delay (which is set to 0 milliseconds), but the callback is not executed immediately. Instead, the event loop puts the callback into the callback queue. The next line, console.log("End"), is executed right away.

After all the synchronous code finishes executing and the call stack is empty, the event loop checks the callback queue. It finds the setTimeout callback waiting and then moves it onto the call stack, allowing it to run. This is why "Timeout callback" is printed last, even though the delay was set to zero.

question mark

What is the main responsibility of the event loop in JavaScript?

Select the correct answer

Var alt klart?

Hvordan kan vi forbedre det?

Tak for dine kommentarer!

Sektion 1. Kapitel 5

Spørg AI

expand

Spørg AI

ChatGPT

Spørg om hvad som helst eller prøv et af de foreslåede spørgsmål for at starte vores chat

Suggested prompts:

Can you explain more about how the callback queue works?

What happens if there are multiple setTimeout callbacks?

How does the event loop handle promises compared to setTimeout?

Awesome!

Completion rate improved to 3.57

bookThe Event Loop in Action

Stryg for at vise menuen

To understand how JavaScript handles multiple tasks without running them all at once, you need to know about the event loop. The event loop is a core part of JavaScript's concurrency model. JavaScript runs in a single thread, which means it can only execute one task at a time. However, web applications often need to perform actions like waiting for user input, making network requests, or running timers—these should not block other code from running. The event loop is the mechanism that allows JavaScript to appear to do many things at once, by managing the execution of synchronous code and deferring asynchronous tasks until the main thread is free.

script.js

script.js

index.html

index.html

copy

In this code sample, you see three statements: a console.log for "Start", a setTimeout with a callback, and a console.log for "End". When this code runs, "Start" is printed first. The setTimeout schedules its callback to run after a delay (which is set to 0 milliseconds), but the callback is not executed immediately. Instead, the event loop puts the callback into the callback queue. The next line, console.log("End"), is executed right away.

After all the synchronous code finishes executing and the call stack is empty, the event loop checks the callback queue. It finds the setTimeout callback waiting and then moves it onto the call stack, allowing it to run. This is why "Timeout callback" is printed last, even though the delay was set to zero.

question mark

What is the main responsibility of the event loop in JavaScript?

Select the correct answer

Var alt klart?

Hvordan kan vi forbedre det?

Tak for dine kommentarer!

Sektion 1. Kapitel 5
some-alt