6.1 Callbacks
A callback is a function passed as an argument to another function, intended to be executed once an asynchronous operation completes. In early JavaScript, callbacks were the primary mechanism for asynchronous programming.
Figure 6.1: Asynchronous callbacks allow the main thread to continue processing while slow tasks wait in the background.
6.2 The Event Loop
Because JavaScript is single-threaded, it has only one Call Stack and can execute only one instruction at a time. The Event Loop coordinates asynchronous execution without freezing the browser UI.
Figure 6.2: The browser handles network requests and timers in the background (Web APIs). When finished, callbacks wait in the queue until the Event Loop confirms the Call Stack is empty.
6.3 Promises
A Promise is a modern JavaScript object representing the eventual completion (or failure) of an asynchronous operation and its resulting value, replacing messy nested callbacks with clean chains.
Figure 6.3: A Promise starts in the Pending state, then permanently transitions to either Fulfilled (invoking .then()) or Rejected (invoking .catch()).
6.4 async / await
Introduced in ES2017, async and await provide syntactic sugar on top of Promises, allowing developers to write asynchronous code that reads like sequential synchronous statements.
Figure 6.4: await yields control back to the event loop until the awaited promise settles, without freezing the main thread.