Was when we first learn js, I knew the js is single-threaded, code is a sequence of speech, but in the actual project, we need to be synchronized code into asynchronous execution, or when some function again involves sex is no longer a process execution, but there is a certain sequence, a solution to the problem of the single thread there are two one is asynchronous encapsulation Another is to use multithreading.

Today, we’ll talk about asynchronous encapsulation, and when it comes to asynchrony, Promise is a must.

1. Promise is introduced:

ES6 specifies that the Promise object is a constructor that generates a Promise instance for all asynchrony. By encapsulating synchronous functions, transform them into asynchronous functions

A Promise has three states: Pending: an asynchronous thing is being executed; Resolve: The asynchronous thing succeeds; Reject: Asynchronous things fail.

2. Application scenarios of Promise

2.1 The order of the call of the request function of provinces and cities

In my previous project, there was a scene where the data of all provinces was requested in mouTED. When the watch monitored the selected province, it would obtain the ID and then request the data of the corresponding city, and then it would obtain the ID of the city to request the data of the corresponding region. The renderings are as follows:

As shown above, requests need to be made sequentially, layer by layer, which requires promise encapsulation

Resolve and reject are parameter functions of the promise parameter function, representing the signal of success and failure to the outside world, and the data can be passed through the function parameters. Then, when the outside world calls the function, the successful state and the successfully transmitted data RES can be obtained by making the then call. Or hit catch to get err. So this function is an asynchronous function, isn’t that easy?

2.2 Simultaneous validation of multiple forms

There could be such a problem, that is, there are multiple forms to validate multiple form at the same time, only when more than one form is successful state is the whole verification through, in the face of such situation, I will think of the multiple forms of formname an array, circle the array verification, the results of the validation and push into an array, And this method uses promise encapsulation, return is a promise object, problem solved…

All determines whether all promise forms pass the checked array. Only if the array is resolve, the form passes the verification

2.3 Callback to hell

In NodeJS, callback is indispensable for asynchronous functions. During the writing process, callback can be used to bring out asynchronous data and get the data after the execution of asynchronous functions.

Callback hell works up to a point, but it has drawbacks, or inelegance, and is very unreadable.

Such as:

I’m solving callback hell here with promise, while I can also use promise’s syntactic sugar async-await, in fact its inner wrapper is promise.

That’s all for today’s summary of the application scenarios of promise in the recent project, just a personal experience to share with those who need it.