Shulou(Shulou.com)05/31 Report--

This article mainly introduces "how to use the then method in es6". In the daily operation, I believe that many people have doubts about how to use the then method in es6. The editor consulted all kinds of materials and sorted out simple and easy-to-use operation methods. I hope it will be helpful to answer the doubts about "how to use the then method in es6". Next, please follow the editor to study!

In es6, then is written as "then (adding a callback function for a successful state change and a failed callback function for a promise instance)". This method is used to add a callback function for a state change to a promise instance, and the result is a new promise instance, and the method can be chained.

This tutorial operating environment: windows10 system, ECMAScript version 6. 0, Dell G3 computer.

What is the way to write then in es6

Written as follows:

Then (parameter 1, parameter 2)

Function: add a callback function when the state changes to the promise instance

Argument 1 is a successful callback function

Argument 2 is a failed callback function

Return value: the then () method returns a new promise instance, and the then () method can be chained.

Expand knowledge:

Promise

1. Concept: Promise is a solution for asynchronous programming.

two。 Async: how asynchronous operations were previously implemented: ① callback function ② event trigger

3. Function: solve the problem of asynchronous operation, which is different from the above two methods.

4. Features: ①: the state of the object is not affected by the outside world, the promise object represents an asynchronous operation, there are three states: Pending (in progress). Fulfilled (completed). Rejected (failed). Only the result of the asynchronous operation can determine which state the current state is, and no other operation can change it.

②: the state of an object, once changed, will not change again, and this result can be obtained at any time. (there are only two possibilities for the state change of Promise objects: from penging to fulfilled and from pending to rejected.

5: basic usage

(1) promise instances can be created through new promise objects.

Const promise=new Promise (function (resolve,reject) {})

(2) Parameter description: the promise object receives a function as a parameter. The parameters of this function are resolve and reject, which are two functions provided by the Javascript engine.

(3) the function of the resolve function: call when the asynchronous operation is successful, and pass the result of the asynchronous operation as a parameter.

(4) the function of reject function: it is called when the asynchronous operation fails and the error reported by the asynchronous operation is passed as a parameter.

Note: after the promise instance is generated, you can use the then method to specify the callback functions for success and failure, respectively.

.then () is a method of the promise instance that indicates the next step to be performed.

For example:

Function ajax () {console.log ("hello"); return new Promise (function (resolve,reject) {setTimeout (function () {resolve ();}, 1000)}) ajax.then (function () {console.log ("world")) })}

The method of 6.Promise instance

(1) then (parameter 1, parameter 2)

Function: add a callback function when the state changes to the promise instance

Parameter 1 is a successful callback function, and parameter 2 is a failed callback function.

Return value: the then () method returns a new promise instance, and the then () method can be chained.

(2) catch ()

Function: specifies the callback function when an error occurs, which is equivalent to the second parameter of the then method

For example:

Let ajax=function (num) {return new Promise ((resolve,reject) {if (num > 5) {resolve (num);} else {throw new Error ("error") }})} ajax (2) .then (function (num) {console.log (num);}) .catch (function (error) {console.log (error);})

Advanced methods of 7.Promise

(1) promise.all ()

Function: package multiple promise instances into a new promise instance. To put it simply, a successful callback will be executed only if multiple asynchronous operations are successful, otherwise a failed callback will be executed.

Parameter description: receives an array as a parameter, and each item of the array is a promise instance

(2) promise.race ()

Function: package multiple promise instances into a new promise instance. As long as one instance takes the lead to change the state, the state of the promise will change accordingly.

Parameter description: receives an array as a parameter, and each item of the array is a promise instance

8.Promise style AjAx

Function promiseAjax (json) {let url=json.url; let type=json.type | | "get"; let data=json.data | | {}; let str= ""; for (let k in data) {str+=k+ "=" + data [k] + "&" } return new Promise ((resolve,reject) = > {let ajax=new XMLHttpRequest (); if (type.toLowerCase () = "get") {ajax.open ("get", `${url}? ${str} time=$ {Date.now ()}`, true); ajax.send () } else if (type.toLowerCase () = "post") {ajax.open ("post", url,true); ajax.setRequestHeader ("content-type", "application/x-www-form-urlencoded"); ajax.send (str.substring (0heroin str.laseIndexOf ("&") } ajax.onreadystatechange=function () {if (ajax.readyState===4) {if (ajax.status > = 200&&ajax.status)

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.