一.Promise
1. What is the object Promise: on behalf of a certain event will happen in the future, generally it refers to asynchronous operation.
2.Promise objects
-
The object of the present: the asynchronous operation to synchronous flow expressed avoid deeply nested callback (the callback commonly known Hell)
-
Role: to solve the asynchronous callbacks
3 state 3.promise objects:
-
pending: initialization state
-
fullfilled: success status
-
rejected: the failed state
4. The basic steps promise object:
-
Create a promise instance object -------> Status promise to initialize the object is pending
-
Perform asynchronous tasks: start a timer, send ajax request
-
To dynamically modify the promise of an object based on the results of asynchronous task execution status: resolve () success, reject () fails
-
Examples of objects have default promise method then requires two parameters, these two parameters are two callback functions
-
When the promise object's state marked success or failure will automatically call when the callback method then
5.promise objects After creating direct execution :
. 1 the console.log ( " Code started " );
2
. 3 the setTimeout (() => {
. 4 the console.log ( " execute the timer " );
. 5 }, 0 );
. 6
. 7 the let Promise = new new Promise (( Resolve , Reject ) => {
. 8 the console.log ( "promise status initialization");
. 9
10 });
. 11
12 is the console.log (promise);
13 is
14 the console.log ( " code execution ends");
As it can be seen from the figure, in which can be defined and executed directly after the promise asynchronous method object is created.
6.promise asynchronous method execution
Asynchronous method promise of a set can only resolve () or Reject () in the same time, the two can not be provided in one place.
Promise to call the object after executing a method of receiving a return value then
-
Success: The first method then execution
-
Failure: The second method of execution then
. 1 the console.log ( " Code started " );
2
. 3 the setTimeout (() => {
. 4 the console.log ( " execute the timer. 1 " );
. 5 }, 0 );
. 6
. 7 the let Promise = new new Promise ((Resolve , Reject) => {
. 8 the console.log ( " initialization state promise " );
. 9 the setTimeout (() => {
10 Resolve ();
. 11 the console.log ( " Resolve () performs " );
12 is // Reject ();
13 is // the console.log ( "Reject () performs");
14 }, 1000 );
15 });
16
. 17 the console.log (Promise);
18 is
. 19 the console.log ( " code execution end " );
20 is
21 is Promise
22 is .then (() => {
23 is the console.log ( " Resolve () is executed successfully " );
24
25 }, () => {
26 is the console.log ( " Reject () execution to fail " );
27
28 });
then 7.promise object () method
(1) then () method can be continuously connected together, if the first asynchronous tasks can be continued successfully second asynchronous task.
. 1 the let NUM = 0 ;
2
. 3 function util () {
. 4 NUM ++ ;
. 5 the let = promise new new Promise ((Resolve, Reject) => {
. 6 the console.log ( " Initialization state promise " );
. 7 the setTimeout (() => {
. 8 Resolve ($ {num} `first asynchronous method succeeded`);
. 9 the console.log ( " Resolve (MSG) performs " );
10 // Reject ( "first asynchronous method fails");
11 / / the console.log ( "Reject (MSG) performs");
12 }, 1000 );
13 is });
14
15 return Promise;
16 }
. 17
18 is util ()
. 19 .then ((Success) => {
20 is the console.log (Success);
21 is
22 is IF (Success) {
23 is
24 return util (); // second asynchronous task
25 }
26 is
27 }, (failure) => {
28 the console.log (failure);
29
30 })
31 is .then ((Success) => {
32 console.log(success);
33 },(failure) =>{
34 console.log(failure);
35 });
(2) If the first task execution regardless of success or failure, the first one then () method is not content to continue after another then () is executed successfully default method.
Concluded, promise.then () returns the default promise successful execution method call after method execution.
. 1 the let NUM = 0 ;
2
. 3 function util () {
. 4 NUM ++ ;
. 5 the let = promise new new Promise ((Resolve, Reject) => {
. 6 the console.log ( " Initialization state promise " );
. 7 the setTimeout (() => {
. 8 Resolve ($ {num} `first asynchronous method succeeded`);
. 9 the console.log ( " Resolve (MSG) performs " );
10 // Reject ( "first asynchronous method fails");
11 / / the console.log ( "Reject (MSG) performs");
12 }, 1000 );
13 is });
14
15 return Promise;
16 }
. 17
18 is util ()
. 19 .then ((Success) => {
20 is the console.log (Success);
21 is
22 is }, (failure) => {
23 is the console.log (failure);
24
25 })
26 is .then ((success) => {
27 the console.log (success);
28 the console.log ( `second asynchronous method succeeded`);
29 }, (failure ) => {
30 console.log(failure);
31 });
1 let num = 0;
2
3 function util() {
4 num++;
5 let promise = new Promise((resolve, reject) => {
6 console.log("初始化promise状态");
7 setTimeout(() => {
8 // resolve(`第${num}个异步方法执行成功`);
9 // console.log("resolve(msg)执行");
10 reject(`第${num}个异步方法执行失败`);
11 console.log("reject(msg)执行");
12 }, 1000);
13 });
14
15 return promise;
16 }
17
18 util()
19 .then((success) => {
20 console.log(success);
21
22 }, (failure) => {
23 console.log(failure);
24
25 })
26 .then((success) =>{
27 console.log(success);
28 console.log(`第2个异步方法执行成功`);
29 },(failure) =>{
30 console.log(failure);
31 console.log(`第2个异步方法执行失败`);
32 });
1 let num = 0;
2
3 function util() {
4 num++;
5 let promise = new Promise((resolve, reject) => {
6 console.log("初始化promise状态");
7 setTimeout(() => {
8 // resolve(`第${num}个异步方法执行成功`);
9 // console.log("resolve(msg)执行");
10 reject(`第${num}个异步方法执行失败`);
11 console.log("reject(msg)执行");
12 }, 1000);
13 });
14
15 return promise;
16 }
17
18 util()
19 .then((success) => {
20 console.log(success);
21
22 }, (failure) => {
23 console.log(failure);
24
25 })
26 .then((success) =>{
27 console.log(success);
28 console.log(`第2个异步方法执行成功`);
29 },(failure) =>{
30 console.log(failure);
31 console.log(`第2个异步方法执行失败`);
32 })
33 .then((success) =>{
34 console.log(success);
35 console.log(`第3个异步方法执行成功`);
36 },(failure) =>{
37 console.log(failure);
38 console.log(`第3个异步方法执行失败`);
39 });
8.promise应用场景：在第一个异步任务成功后调用第二个异步任务执行（例如第一个定时器执行成功后调用第二个定时器执行）
执行过程分析：
