Javascript - Asynchrony

About

This page is about Asynchrony in javascript.

Asynchrony is not only critical to the performance of our applications, but it’s also increasingly becoming the critical factor in writability and maintainability.

Javascript knowns 2 asynchronous method:

Example

Fetch operations are asynchronous by nature and returns generally a promise. See Browser - Fetching Resources (Request/Response).

Event loop

Javascript is single threaded, whenever you use an asynchronous method (callback, async/promise) in javascript, it gets put into a queue, called by the event loop, and gets executed there.

Method

Callback

callbacks is the primary method of enabling asynchrony.

Callback pyramid of doom

// https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Using_promises
doSomething(function(result) {
  doSomethingElse(result, function(newResult) {
    doThirdThing(newResult, function(finalResult) {
      console.log('Got the final result: ' + finalResult);
    }, failureCallback);
  }, failureCallback);
}, failureCallback);

getData( a => {
     getMoreData(a, b => {
         getMoreData(b, c => {
             getMoreData(c, d => {
                 getMoreData(d, e => {
                     console.log(e);
                 }
             }
         }
     }
}

Promise

The promise function has two syntax:

Documentation / Reference





Discover More
Chrome Devtool Xhr Fetch Request
Browser - Ajax (Asynchronous JavaScript And XML)

Asynchronous Javascript and XML (Ajax) is just a name umbrella to talk a technology that retrieve data from a server asynchronously. Ajax Every Ajax call is using: a XMLHttpRequest (XHR) request...
Chrome Devtool Xhr Fetch Request
Browser - Web API - Fetch function

The fetch function is part of the web api function and is a AJAX call. It's one of the possibilities to fetch a resource. XMLHttpRequest (XHR) The fetch function returns a promise as response. The Fetch...
How to manipulate a Binary large object (BLOB) with Javascript?

The blob object is a data container for blob content This is the API to work with binary data in the browser and is widely supported Because any type of data is...
Javascript - Callback

This page is callbacks in Javascript. It is the primary method of enabling asynchrony. With argument, you are not passing the function but the return value of the function. You need then to wrap...
Javascript Es Promise State
Javascript - Promise Function

in the Javascript context A promise is a function that encapsulate a executor function in order to: execute it asynchronously and returns its result (ie ) A promise is one way of enabling asynchrony...
Card Puncher Data Processing
Observable

Cells is the notebook are named and are then variable hosting a function or a value (as javascript does) Cells can be: expressions blocks. { } an object literal ({ }) Example a cell named letters:...
Card Puncher Data Processing
What is an Event Loop?

An Event loop is a thread that waits for and dispatches events or messages that may contains: data or runnable code An event loop is also known as: message dispatcher, message loop, message...



Share this page:
Follow us:
Task Runner