JavaScript is a single-threaded programming language, which means it has a single call stack. Having a single call stack means that it can only handle one task at a time.
A call stack is a data structure that records where we are in the program.
Its operation is as follows: When a function is executed, its record is added (pushed) to the top of the stack.
When we return a result from the function, the function that was previously on the stack is removed.
For example:
function multiply(x, y) {
return x * y;
}
function printSquare(x) {
var s = multiply(x, x);
console.log(s);
}
printSquare(5);
In a web browser, each time an event occurs, a message is added and an event listener is attached.
Therefore, if there is no listener, the event will be lost.
Callback function invocation is used as the initial frame of the call stack, and since JavaScript is a single-threaded language, all polling and processing of messages are stopped until all calls on the stack are returned.
Synchronous function calls, on the
other hand, add a new call frame to the stack, which is the opposite of
asynchronous callback function invocation.