Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.
Lernen 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

War alles klar?

Wie können wir es verbessern?

Danke für Ihr Feedback!

Abschnitt 1. Kapitel 5

Fragen Sie AI

expand

Fragen Sie AI

ChatGPT

Fragen Sie alles oder probieren Sie eine der vorgeschlagenen Fragen, um unser Gespräch zu beginnen

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

Swipe um das Menü anzuzeigen

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

War alles klar?

Wie können wir es verbessern?

Danke für Ihr Feedback!

Abschnitt 1. Kapitel 5
some-alt