javascript——Promise（js的promise实现原理）

1.Promise

ES6开始支持，Promise对象用于一个异步操作的最终完成（包括成功和失败）及结果值的表示。简单说就是处理异步请求的。之所以叫Promise，就是我承诺，如果成功则怎么处理，失败怎么处理。

// 语法new Promise(/下面定义的函数是executor/function(resolve, reject) {...})

[点击并拖拽以移动]1.1 executor

executor是一个带有resolve和reject参数的函数
executor函数在 Promise构造函数执行时立即执行，被传递resolve和reject函数（executor函数在Promise构造函数返回新建的对象前被调用）
executor内部通常会执行一些异步操作，一旦完成，可以调用resolve函数来将promise对象的状态改为fulfilled即完成，或者发生错误时将promise对象的状态改为rejected即失败。
如果在executor函数中抛出一个错误，那么该promise状态为rejected，executor函数的返回值被忽略。
executor中，resolve或reject函数只能执行其中的一个

promise的状态：

pending：初始状态，不是成功或失败
fulfilled：意味着操作成功完成
rejected：意味着操作失败

Promise.then(onFulfilled, onRejected)

参数是2个函数，根据Promise的装态来调用不同的函数，fulfilled走OnFulfilled函数，rejected走onRejected函数。then的返回值是一个新的promise对象，执行任意一个函数，对这个promise对象来说就是其返回值。调用任意一个函数后，其返回值可以被后续的then方法继续捕捉。

catch（onRejected）

为当前Promise对象添加一个拒绝回调，返回一个新的Promise对象。

我们来看一个简单的例子：

var myPromise = new Promise(function (resolve, reject){//resolve('hello')console.log('~~~~~~~~~~')reject('hello world!')})

console.log(myPromise)

var pro1 = myPromise.then((value) => console.log(1, myPromise, value),(reason) => console.log(2, myPromise, reason) // 不管哪个回调函数被执行，新的promise对象的状态都会变为fulfilled)

// 可以继续被捕捉var pro2 = pro1.then((value) => console.log(3, myPromise, value),(reason) => console.log(4, myPromise, reason))

pro2.then(value => {console.log(5, pro2, value)return Promise.reject('pro2 rejected') // 将新的promise对象的状态改为rejected},reason => console.log(6, pro2, reason)).catch(reason => {console.log(7, reason)return Promise.resolve(reason + '*') // 将新的promise对象的状态改为resolved}).then(value => console.log(8, value),reason => console.log(9, reason)

)

/*Promise { 'hello world!' }
2 Promise { 'hello world!' } 'hello world!'
3 Promise { 'hello world!' } undefined
5 Promise { undefined } undefined
7 'pro2 rejected'
8 'pro2 rejected*'
*/

对Promise的几点总结：Promise：resolve, reject两个函数无返回值then方法返回一个新的Promise对象，新对象的打印结果为then方法执行的函数的返回值；catch方法也是返回一个新的Promise对象。then的回调函数：fulfilled成功的状态 ==> 会调用onfulfilled回调函数，其参数为valuerejected失败的状态 ==> 会调用onrejected回调函数，其参数为reason不管哪一个回调函数执行后，新的promise对象的状态就变为fulfilled

catch只有一个回调函数==> reason如果不能catch到，以当前对象(pro1)的结果作为新对象(pro2)的结果；如果catch到，新的promise对象的状态就变为fulfilled

再来看一个例子：

function runAsync(){return new Promise(function(resolve, reject){setTimeout(function(){console.log('do something')resolve('ok')}, 3000) // 3000毫秒也就是3秒})}

runAsync().then(value => {console.log(value)return Promise.reject(value + '*****') // 将新的promise对象的状态改为rejected}).catch(reason => {console.log(reason)return Promise.resolve(reason + '~~~~~~~~~~~') // 将新的promise对象的状态改为resolved}).then(value => {console.log(value)console.log('Promise END')})

console.log('========FIN========')

/*========FIN========do somethingokok*****ok*****~~~~~~~~~~~Promise END*/