What is callback hell? What is callback hell? What is callback hell

The callback hell

Concept: Multiple layers of callback functions are nested within each other to form a callback function

Fix callback hell:promiseusepromiseTo solve the callback hell problem

promiseThe basic concept

1. Promise is a constructor that returns a promise instance object with new Promise

  1. Promise.prototype contains a.then() method instantiation object that can be accessedthenmethods
  2. The then() method is used to pre-specify successful and failed callback functions

promiseBasic usage of

Const p1 = new Promise((resolve,reject) => {resolve(); reject();Copy the code
const fs = require('fs') const path = require('path') const p1 = new Promise((resolve,reject) => { Fs. readFile(file path,'utf8',(err,data) => {// Err is an object, error is read. // Err is null, error is read. resolve(data) }) }) p1.then(res => console.log(res), err => console.log(err))Copy the code

. Then () method

If a.then() method returns a new Promise instance object, then the callback hell problem can be solved by a chain call to the next.then() method

Catch errors with.catch

  • If an error occurs during the chain operation of a Promise, the promise.prototype. catch method can be used to catch and handle it

Promise. All () method

The promise.all () method initiates parallel asynchronous Promise operations and waits until all asynchronous operations are complete before performing the next.then operation (wait mechanism)Copy the code

Promise. Race () method

Async and await (emphasis)

Grammar:

Async function fn() {const r1 = await Promise} const fn = async () => {const r1 = await Promise}Copy the code

Advantages and disadvantages of.then()

1.. The advantage of then chain calls solves the problem of callback hell

2.. Then chain call disadvantages, many code, poor reading, not easy to understand

Events to note:

  • The keyword await is followed byPromise object
  • The await keyword can only come out of the objectasyncInside of the modified function
  • In async methods, the code before the first await is executed synchronously and the code after await is executed asynchronously

EventLoop

Listen for tasks in the task queue. If there are tasks in the task list that need to be executed, the tasks will be executed in sequenceCopy the code
  1. Js is a single thread, which causes thread deadlocks, and synchronization blocks subsequent code execution
  2. Js executes non-time-consuming tasks on the main thread and delegates time-consuming tasks to the host environment
  3. The host environment is: browser NodeJS
  4. If the asynchronous operation in the main thread, asynchronous operations will be delegated to the host environment to perform, the host environment after performing the asynchronous operation, the callback function will be added to the task queue, the main thread if all the time-consuming tasks, will automatically scan tasks in the queue for tasks need to be performed, if any, will be executed in sequence