What is callback hell:

Nested layers of callback functions create callback hell, as shown below:

Code coupling is too strong, difficult to maintain, a large number of redundant code nesting, poor readability

Promise

  • A Promise is a constructor that can create a new Promise instance

  • New, representing an asynchronous operation

  • Promise.prototype contains a.then() method that can be accessed through the prototype chain

  • The.then() method can be used to pre-specify successful and failed callback functions

  • Features of the.then() method: If the previous.then() method returns a new Promise instance object, processing can continue with the next.then() method, and the problem of callback hell can be solved by chain calls of the.then() method

  • .catch Catch errors:

Catch ((err)=>{}) at the end of the instance function

The.catch () callback can be executed as soon as the.catch () callback is completed

So if.catch() is put at the end, it will catch all of the previous errors, and if it doesn’t work, it can go ahead

  • Promise.all()

This method initiates a parallel Promise asynchronous operation and waits for all asynchronous operations to complete before executing the next.then() operation

  • Promise. Race ()

This method initiates parallel Promise asynchronous actions and executes.then() as soon as any of the asynchronous actions complete (race mechanism)

  • The ultimate async await solution in ES8 (this writing style is the most recommended)

1. Async and await must be paired
2. Inside the method, the code before the first await is executed synchronously

Synchronous and asynchronous tasks (Ajax,setTimeout, nodejs -> Reading and writing files) console.log(123)

3 If the return value of a method (function) is a Promise instance object, we can precede it with an await. After that, the return value is no longer a Promise instance and becomes a real value. Note: if we use await internally, the method must be preceded by async!!
4 In async methods, code before the first ‘await’ is executed synchronously, including code following ‘await’ in parallel

Macro and micro tasks

Synchronous asynchronous, because JS is a single-threaded language, so when queuing, if the previous task is time-consuming, the subsequent task cannot be executed immediately, resulting in a state of suspended animation. Therefore, the MAIN JS thread will be entrusted to the host environment to deal with these time-consuming tasks, also known as asynchronous tasks:

  • JS divides asynchronous tasks into two parts, one is macro task, one is micro task

  • Macro tasks: (Ajax setTimeout /setInterval) and micro tasks (then) features: macro tasks are executed one at a time; Microtasks are performed all at once

  • Microtasks: promise.then (),.catch() and.finally

  • Process. NextTick and so on

  • After each macro task is executed, the system checks whether there are any microtasks to be executed. If there are, all the microtasks will be executed and the next macro task will be executed