###promise原理系列目录:
promise实现原理(一)promise.then
promise实现原理(二)promise.catch
promise实现原理(三)promise.finally
promise实现原理(四)promise.all与promise.race
promise实现原理(五)promise.allSettled与promise.any
promise实现原理(六)promise.resolve与promise.reject
promise实现最终版!合成代码
来看一下最终代码吧!
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151
| function myPromise(callback) { var self = this; self.status = 'pending';//创建当前状态为pending self.data = null;//此变量为保存成功状态的数据使用 self.callbackObj = {};//回调对象,用于存放.then中的回调 self.doCallback=function(){//执行回调函数 let callBackArr = [] if(self.status == 'resolved'){//取构造函数中保存的data,传入callback方法里 callBackArr = self.callbackObj.resolveCallback; }else if(self.status == 'rejected'){ if(self.callbackObj.rejectCallBack[0]){ callBackArr = self.callbackObj.rejectCallBack; }else{ callBackArr = [self.callbackObj.catchCallBack]; } } if(callBackArr&&callBackArr.length>0){ callBackArr.forEach((item)=>{ item&&item(self.data) }) } if(self.callbackObj.finallyCallback){ self.callbackObj.finallyCallback() } } function resolve(value) {//声明resolve方法,支持报成功 if(self.status === 'pending') { self.status = 'resolved'; self.data = value; self.doCallback() } } function reject(value) { if(self.status === 'pending') { self.status = 'rejected'; self.data = value; self.doCallback() } } setTimeout(function(){ callback&&callback(resolve,reject); }) }
//根据es6文档,此处的promise,原型链上需要增加一个.then方法,来支持调用结果后,执行的方法,此方法也接收一个回调函数 myPromise.prototype.then = function(resolveCallback,rejectCallBack){//.then存入待执行事件,不然如果是异步操作,则未完成时候.then就执行了 this.callbackObj.resolveCallback?this.callbackObj.resolveCallback.push(resolveCallback):this.callbackObj.resolveCallback=[resolveCallback]; this.callbackObj.rejectCallBack?this.callbackObj.rejectCallBack.push(rejectCallBack):this.callbackObj.rejectCallBack=[rejectCallBack]; return this }
myPromise.prototype.catch=function(catchCallBack){ this.callbackObj.catchCallBack=catchCallBack; }
myPromise.prototype.finally=function(finallyCallback){ this.callbackObj.finallyCallback=finallyCallback; }
myPromise.all = function(promiseArr=[]){ let resultArr = [];//当前已完成的子promisedata结果 return new myPromise((resolve)=>{ promiseArr.forEach((item)=>{ item.then((data)=>{ resultArr.push(data); console.log(resultArr.length==promiseArr.length,100) if(resultArr.length==promiseArr.length){ resolve(resultArr) } }) }) }) }
myPromise.race = function(promiseArr=[]){ new myPromise((resolve)=>{ promiseArr.forEach((item)=>{ item.then((data)=>{ resolve(data) }) }) }) }
myPromise.allSettled = function(promiseArr=[]){ let resultArr = [];//当前已完成的子promisedata结果 let okNum = 0; return new myPromise((resolve,reject)=>{ function doCallBack(){//执行结果 if(okNum==promiseArr.length){ resolve(resultArr) } } promiseArr.forEach((item)=>{ item.then((data)=>{ resultArr.push({ status:"fulfilled", value:data }); okNum++; doCallBack() },(data)=>{ resultArr.push({ status:"rejected", value:data }); okNum++; doCallBack() }) }) }) }
myPromise.any = function(promiseArr=[]) { return new myPromise((resolve,reject)=>{ let resultArr = []; let okNum = 0; function doCallBack(){//执行结果 if(okNum==promiseArr.length){ reject(resultArr) } } promiseArr.forEach((item)=>{ item.then((data)=>{ this.status="fulfilled"; resolve(data); },(data)=>{ okNum++ resultArr.push('reject') }) }) }) }
myPromise.resolve = function(data){ return new myPromise((resolve)=>{ resolve(data) }) }
myPromise.reject = function(data){ return new myPromise((resolve,reject)=>{ reject(data) }) }
|