Shulou(Shulou.com)06/01 Report--

This article mainly explains "how javascript solves asynchronous problems". The content of the explanation is simple and clear, and it is easy to learn and understand. Please follow the editor's train of thought to study and learn "how to solve asynchronous problems in javascript".

1. Use callback function

Friends who have learned and used jQuery will know this method, which is a function that passes itself as a variable to another function after the execution of the host function is complete. The code is as follows:

Let delayWithCallback = (time, callback) = > {console.log ('handle...') SetTimeout (() = > {if (typeof callback = 'function') {callback (`room`)}}, time)}

You can see in the code that we deal with callbacks in the callback method.

two。 Use Promise

This method uses its own constructor to accept a function as an argument to represent the callback function after the successful execution of the operation and the callback function after the failure of the asynchronous operation.

The parameters of Promise are resolve and reject; codes are as follows:

Let index = 1 index++ setTimeout delayWithPromise = (time) = > {return new Promise ((resolve, reject) = > {console.log (`index++ setTimeout {index} handle.`) index++ setTimeout (() = > {resolve ('success')}, time)})}

We can also use the then method to make callbacks on top of this method. The code is as follows:

Let func2 = () = > {console.log ('start') delayWithPromise (1000). Then (result = > {console.log (result) console.log (' end')})} func2 ()

We can see from the code that then is implemented by receiving two parameters in Promise.prototype.then ().

3. Use async or await to solve asynchronous problems

Because these two methods are new features in ES7, there are these features about their usage:

(1)。 We can add the async keyword before function to indicate that this is an async function; and the return value of async is a Promise object, so we can also add a callback function with the then method.

(2)。 When we use await, it should be followed by a promise object, if not, it will be converted to a Promise object containing resolve, and await means to wait for the promise to return the result before continuing to execute.

Here is a related code:

Let func6 = async () = > {console.log ('start') let result = await delayWithPromise (1000); console.log (result) console.log (' end')} func6 ()

(3)。 Execute the code one by one using async or await as follows:

Let func7 = async () = > {console.log ('start') let result1 = await delayWithPromise let result2 = await delayWithPromise (500) console.dir (result1, result2) console.log (' end')} func7 ()

When we use this method, this function comes out step by step according to the program. There is also a time interval for 500ms.

(4)。 Use async or await to execute methods simultaneously

Let func8 = async () = > {console.log ('start') let [result1, result2] = await Promise.all ([delayWithPromise (500), delayWithPromise (500)]) console.dir (result1, result2)} func8 () Thank you for reading. This is the content of "how javascript solves Asynchronous problems". After studying this article, I believe you have a deeper understanding of how javascript solves asynchronous problems. The specific use situation still needs to be verified by practice. Here is, the editor will push for you more related knowledge points of the article, welcome to follow!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.