You are on page 1of 1

Asynchronous: More than one at a time.

the js engine is only one of the many engines running on a browser like rendering
engine and http request.

the js engines has hooks to talk to these other engines.

the js engine itself is synchronous. howver the js engine works async with all
other engines.

aside from the stack, there is another list running in the js engine - the event
Queue!

Event Queue - full of events and notifs of events. when the browser has an evetn
for the js engine, it gets places on the queue. ie a click event.

the event queue gets looked at by the js engine when the execution stack is empty.
and checks if the event calls any js function.
ie. click event and the clickHandler() function

**long-running functions can actually have effect on events being handled by the js
engine

code:
//long running function
function waitThreeSeconds(){
var ms = 3000 + new Date().getTime();
while (new Date() < ms){}
console.log('finished function')
}

function clickHandler(){
console.log('click event!');
}

//listen for the click event


document.addEventListener('click', clickHandler);

waitThreeSeconds();
console.log('finished execution');

output: at click before 3 seconds


finished function

finished execution

click event!

this is a demonstartion of the async and sync nature of the js engine.

** the event loop does the continual check on the event queue

You might also like