JAVASCRIPT

event loop

Event Loop : The event loop is the secret behind JavaScript's asynchronous 
programming. JS executes all operations on a single thread, but using a 
few smart data structures, it gives us the illusion of multi-threading.

Easy Definition : 
The Event Loop has one simple job — to monitor the Call Stack and the 
Callback Queue or Message Queue. 

If the Call Stack is empty, it will take the first event from the
Callback queue and will push it to the Call Stack, which effectively runs it. 

Such an iteration is called a tick in the Event Loop. 
Each event is just a function callback.

Easiest explanation : 
When any Asynchronous event occur such as setTimeOut or promises... 
Then these task takes some time to complete I/O if they have any. 
If they completed their I/O or don't have any, then they simply put into 
message queue or callback queue. Then event loop will firstly execute the 
call stack tasks and then look for callback or message queue and then execute it..

For more info visit : https://nodejs.dev/learn/the-nodejs-event-loop

event loop in javascript

The Event Loop has one simple job — to monitor the Call Stack 
and the Callback Queue. If the Call Stack is empty, it will 
take the first event from the queue and will push it to the 
Call Stack, which effectively runs it. Such an iteration is 
called a tick in the Event Loop. Each event is just a function 
callback.

#bpn

Javascript Event Loop

const first = () => console.log('Hi,i am first');
const second = () => console.log('Hi,i am second');
const third = () => console.log('Hi,i am third');
const fourth = () => {
    first();
    setTimeout(second, 4000);
    //store in queue & it will execute after 4 seconds
    setTimeout(third, 2000);
    //store in queue & it will execute after 2 seconds
    console.log('Hi,i am fourth');
};
fourth();

//Expected output:
/*Hi,i am first
  Hi,i am fourth
  Hi,i am third
  Hi,i am second 
*/

javascript the event loop

* JavaScript is single threaded. so it needs event loop to run asynchronous (Multi Thread) code.
* JavaScript first runs synchronous code, then it queue asynchronous code to call later.
* Asynchronous code is called/executed by event loop.
* System/Browser takes synchronous code and put them as tasks. then these tasks are put them into queue.
* The Event Loop has one simple job — to monitor the is there any task to handle.
* System/Browser push the task to call stack.
* Then the event loop will check the call stack and execute the task.
* Then it waits for the next task to be pushed to the call stack.

javascript event loop

            
                
            
         console.log('Hi!');

setTimeout(() => {
    console.log('Execute immediately.');
}, 0);

console.log('Bye!');
Code language: JavaScript (javascript)

what is event loop in javascript

The Event Loop has one simple job — to monitor the Call Stack 
and the Callback Queue

event loop javascript

console.log('Hi!');

setTimeout(() => {
    console.log('Execute immediately.');
}, 0);

console.log('Bye!');

// print order
// 'Hi!'
// 'Bye!'
// 'Execute immediately.'

javascript event loop

         function task(message) {
    // emulate time consuming task
    let n = 10000000000;
    while (n > 0){
        n--;
    }
    console.log(message);
}

console.log('Start script...');
task('Download a file.');
console.log('Done!');
Code language: JavaScript (javascript)

javascript event loop

function foo(b) {
  let a = 10
  return a + b + 11
}

function bar(x) {
  let y = 3
  return foo(x * y)
}

const baz = bar(7) // assigns 42 to baz