diff --git a/async-await/async-javascript.md b/async-await/async-javascript.md new file mode 100644 index 0000000..d2ef5a7 --- /dev/null +++ b/async-await/async-javascript.md @@ -0,0 +1,41 @@ +# Asynchronous JavaScript + +JavaScript is single-threaded but it can still take advantage of asynchronous +programming. + +When we say JavaScript is single-threaded, we mean that we cannot write +multithread code without using JavaScript APIs. In fact, +despite for us it appears single-threaded, it takes advantage of the +`libuv` library, allowing the engine to be effectively multithread. + +In order to do that, JavaScript uses +* The libuv APIs which allow multithreading +* The Event Loop Queue + +## Explaination +JavaScript provides a set of APIs, including `setTimeout` and `fetch`, which +are offloaded to the libuv library when called. The libuv library handles the +underlying operations, such as timer management and HTTP requests, respectively. +Both setTimeout and fetch have associated functions, known as callbacks, that +are executed once the operation has completed. + +Since the engine cannot directly push these callback functions onto the call stack +without disrupting the current flow of execution, it instead places them in a +queue called the "Event Loop Queue". When the call stack is empty, the engine +checks the queue and, if there are any pending callbacks, proceeds to execute them. + +**Example** + +```javascript +setTimeout(() => console.log('I will go in the event loop queue first'), 1000); +console.log('I am in the stack'); +``` + +What is happening here? `setTimeout` is a JavaScript API which will be taken care +of the `libuv` library which will be responsible for checking when 1000ms have passed. +**Concurrently** to the `libuv` library doing what it has to do, the engine executes +`console.log('I am in the stack');`. +When 1000ms have elapsed, the callback function associated with the timer (console.log) +gets enqueued in the Queue. +Since there is nothing to do in the stack, the callback pushes the callback onto the +stack and executes it. \ No newline at end of file diff --git a/async-await/event-loop.md b/async-await/event-loop.md deleted file mode 100644 index 0a1c2a4..0000000 --- a/async-await/event-loop.md +++ /dev/null @@ -1,30 +0,0 @@ -# The Event Loop - -JavaScript is single-threaded but it can still take advantage of asynchronous -programming. - -In order to do that, the runtime keeps a structure called The Event Loop which -is responsible for holding operations to be executed asynchronously with -respect to the main flow of execution. Whenever we meet a portion of code that -may not be possible to execute now, it is put in the Event Loop. Let's look at -some examples: - -**Example 1** - -```javascript -setTimeout(() => console.log('test'), 1000); -``` -`console.log('test')` will be put in the Event Loop. - -**Example 2** - -```javascript -const promise = new Promise(function (resolve, reject) { - console.log('test'); - resolve(); -}).then(() => { - console.log('test2'); -}); - -``` -`console.log('test2')` will be put in the Event Loop. \ No newline at end of file