promise appears to deal with asynchrony in JavaScript and to avoid callback hell. promise has three states: pending/reslove/reject.
Pending is pending, resolve can be understood as success, and reject can be understood as rejection. The final state of promise will solidify. After success, even if you execute reject ('failed ') again, the state will not change.
Promise is a constructor. It has methods such as all, reject and resolve. The prototype has the same methods such as then and catch. So the object generated by Promise new must have then and catch methods.
We can use these methods by creating an instance.
let Mypromise = new Promise(function(resolve,reject){ setTimeout(function(){ let a = 22; let b = 20; if(a>b){ // If you go resolve,Trigger.then,hold a+b Value passed in.then resolve(a+b); }else{ // If you go reject,Trigger.catch,output err 'b>a' reject('b>a'); } },2000); }); // When b>a When I was young, Mypromise.then This string of code will not be triggered Mypromise.then(function(value){ console.log('2s after'); console.log(value,'value'); // If then Returned in is a Promise Object, then next then Will be equivalent to a return on this Promise Operate // Remember, if you want to go on to the next one.then To pass parameters, you must return return new Promise(function(resolve,reject){ setTimeout(function(){ let c = 41; if(c<value){ // If you go resolve,Trigger.then,hold value-c Value passed in.then resolve(value-c); }else{ // If you go reject,Trigger.catch,output err 'c>value' reject('c>value'); } },1000) }) }).then(function(data){ console.log('1s after'); console.log(data,'data'); }) .catch(function(err){ console.log(err) })
You can see that this string of code is resolved when a > b, otherwise reject. First of all, we need to know that it will be executed when resolve is triggered then(), which will be executed when reject is triggered catch(),
a=22, b=20, so a > b, go resolve, resolve passes the value of a+b to then,
That is to pass 42 to then, it's time to execute then(), first outputs value, that is, the value passed by resolve, (note that the value here can be named arbitrarily),
then. There is a new Promise in then(). If a Promise object is returned in then, the next then will be equivalent to operating on the returned Promise,
And if you want to continue to give the next one When then passes parameters, you must return. If you don't return, the result will become 42 and undefined,
Promise cannot return a value. It can only return promise, because it is asynchronous. If you want to use it, you have to use {fn1() Then (value = > console.log (value)),
So when it comes to the second promise, go to resolve and execute Then, second Then passed the first Then, return passes the value of value-c to date is output in then,
What if we change b to 25?
let Mypromise = new Promise(function(resolve,reject){ setTimeout(function(){ let a = 22; let b = 25;//It became 25 if(a>b){ // If you go resolve,Trigger.then,hold a+b Value passed in.then resolve(a+b); }else{ // If you go reject,Trigger.catch,output err 'b>a' reject('b>a'); } },2000); }); // When b>a When I was young, Mypromise.then This string of codes will not be triggered Mypromise.then(function(value){ console.log('2s after'); console.log(value,'value'); // If then Returned in is a Promise Object, then next then Will be equivalent to a return on this Promise Operate // Remember, if you want to go on to the next one.then To pass parameters, you must return return new Promise(function(resolve,reject){ setTimeout(function(){ let c = 41; if(c<value){ // If you go resolve,Trigger.then,hold value-c Value passed in.then resolve(value-c); }else{ // If you go reject,Trigger.catch,output err 'c>value' reject('c>value'); } },1000) }) }).then(function(data){ console.log('1s after'); console.log(data,'data'); }) .catch(function(err){ console.log(err) })
Change B to 25. B is larger than a, so reject is left. At this time, only 'b > a' is output,
Because he didn't go to resolve, it won't trigger naturally then, so the following code block will not be executed.
It's purely Xiaobai's study notes. If there are any incorrect ones, I hope you guys can correct them!!!