当前位置: 首页 > Web前端 > JavaScript

手写一个承诺过程(二)

时间:2023-03-27 17:15:41 JavaScript

实现promise中then方法的链式调用constPEDDING='PEDDING'constRESOLVE='RESOLVE'constREJECT='REJECT'//promise有三种状态consthandlePromise=(result,newPromise,resolve,reject)=>{if(result===newPromise){thrownewError('cannotreturnitself')}//返回的是对象或者方法(也可以是promise)if(typeofresult==='object'&&typeofresult!==null||typeofresult==='function'){//判断result是否有then方法constthen=result.thenif(typeofthen==='function'){//如果then方法是一个函数,默认是promise//调用call方法then.call(result,r=>{//继续调用自己,r就是then中的reshandlePromise(r,newPromise,resolve,reject)},e=>{reject(e)})}else{resolve(result)}}else{//返回正常值resolve(result)}}classNewPromise{//初始状态为PEDDINGstatus=PEDDINGresult=undefinedreason=undefined//发布订阅者模式//目的是ach实现异步onResolveArr=[]onRejectArr=[]constructor(exc){constresolve=(result)=>{if(this.status===PEDDING){this.result=resultthis.status=RESOLVE//执行发布者this.onResolveArr.map((fn)=>fn())}}constreject=(reason)=>{if(this.status===PEDDING){this.reason=reasonthis.status=REJECT//执行发布者this.onRejectArr.map((fn)=>fn())}}exc(resolve,reject)}then(onResolve,onReject){constnewPromise=newNewPromise((resolve,reject)=>{if(this.status===RESOLVE){setTimeout(()=>{constresult=onResolve(this.result)handlePromise(result,newPromise,resolve,reject)},0)}if(this.status===REJECT){setTimeout(()=>{constresult=onReject(this.reason)handlePromise(result,newPromise,resolve,reject)},0)}//发布订阅者模式if(this.status===PEDDING){//添加订阅者到数组this.onResolveArr.push(()=>{constresult=onResolve(this.result)handlePromise(result,newPromise,resolve,reject)})this.onRejectArr.push(()=>{constresult=this.onReject(this.reason)handlePromise(result,newPromise,resolve,reject)})}})返回newPromise}}//letyan=newPromise((resole,reject)=>{//resole('燕叔真帅')//})//yan.then(res=>{//console.log(res)//})letnewYan=newNewPromise((resole,reject)=>{setTimeout(()=>{resole('新颜好帅')return'1111'},3000)})newYan.然后((res)=>{console.log(res)return{name:'yan'}}).then((res)=>{console.log(res)})console.log(11111111)