promise,那么在开发的时候往往需要用到promise。Promise有很多特点。这一次,我们就总结一下promise的特点,从零开始写一个promise。Step1Promise特性1.创建的时候需要传入一个函数,否则会报错2.传入的函数会设置两个回调函数3.刚刚创建的Promise对象的状态是pendingclassMyPromise{constructor(handle){//3、新建的Promise对象的状态是pendingthis.status="pending";//1、创建的时候需要传入一个函数,否则会报错if(!this._isFunction(handle)){thrownewError("请传入一个函数");}//2、传入的函数会设置两个回调函数handle(this._resolve.bind(this),this._reject.bind(this))}_resolve(){}_reject(){}_isFunction(fn){返回类型fn===“函数”;}}Step2Promise特性4,状态一旦改变,不能再次改变5,可以通过then监听状态变化5.1,如果创建监听,状态已经改变,立即执行监听回调5.2.如果在创建监控的时候状态没有变化,会等待状态变化后再执行5.3。同一个promise对象可以添加多个then监视器。当状态改变时,会按照注册的顺序执行//定义常量保存对象constPENDING="pending";constFULFILLED="fulfilled";constREJECTED="rejected";classMyPromise{constructor(handle){//3、新建的Promise对象的状态是pendingthis.status=PENDING;//成功回调的值this.value=undefined;//失败回调的值this.reason=undefined;//注册成功回调this.onResolvedCallbacks=[];//注册失败回调this.onRejectedCallbacks=[];//1、创建时需要传入一个函数,否则会报错if(!this._isFunction(handle)){thrownewError("请传入一个函数");}//2、传入的函数会设置两个回调函数handle(this._resolve.bind(this),this._reject.bind(this))}_resolve(value){//4.一旦状态改变,if(this.status===PENDING){this.status=FULFILLED;不能再次更改this.value=值;//5.3,同一个promise对象可以添加多个then监听器,当状态改变时Executethis.onResolvedCallbacks.forEach(fn=>fn(this.value));}}_reject(reason){//4、状态一旦改变,就不能再改变if(this.status===PENDING){this.status=REJECTED;this.reason=原因;//5.3,同一个promise对象可以添加多个then监听器,this.onRejectedCallbacks.forEach(fn=>fn(this.reason));}}then(onResolved,onRejected){//判断是否有回调成功if(this._isFunction(onResolved)){//5.1、创建监听时如果状态发生变化,立即执行监听回调if(this.status===FULFILLED){onResolved(this.value);}}//判断是否有传入失败的回调if(this._isFunction(onRejected)){//5.1、如果创建监听时状态发生了变化,则立即执行监听回调if(this.status===REJECTED){onRejected(this.reason);}}//5.2,如果监听器创建时状态没有变化,则在状态变化后执行.push(onResolved);}if(this._isFunction(onRejected)){this.onRejectedCallbacks.push(onRejected);}}}_isFunction(fn){returntypeoffn==="函数";}}详细答案参考前端手写面试题。then方法接受两个参数:成功回调和失败回调。如果promise失败,但是没有注册失败监听,就会报错。Promise对象如果then方法只有一个成功的回调,那么它返回的promise的状态会继承当前promise的状态如果当前promise的状态是成功的:新的promise的值就是成功的返回值当前then的回调。如果当前promise状态为失败:新promise没有失败监听,会报错。如果then方法同时包含成功回调和失败回调,则其返回的promise状态为成功,值为成功或失败回调的返回值。回调函数的返回值如果then方法的成功/失败回调返回一个promise对象,则then方法返回的新promise对象的状态由新promise的内部决定。而这个值就是新promise的内部resolve/reject函数传递过来的参数。如果then方法的成功/失败回调返回普通数据类型,则then方法返回的新promise对象的状态为成功。而value是成功/失败回调的返回值,也就是会传递给新的promise对象成功的回调。如果then方法的成功/失败回调没有返回值,则返回普通数据类型。失败回调函数可以在前面promise对象的then方法中执行成功回调函数时捕获异常。then(onResolved,onRejected){returnnewMyPromise((nextResolve,nextReject)=>{//1.判断是否有回调成功if(this._isFunction(onResolved)){//2.判断当前状态是否为successfulif(this.status===FULFILLED){try{//获取最后一个promise成功回调执行的结果letresult=onResolved(this.value);//console.log("result",result);//判断执行结果是否是promise对象);}}catch(e){nextReject(e);}}}//1.判断是否有失败的回调//if(this._isFunction(onRejected)){try{//2.判断当前是否有状态是失败状态if(this.status===REJECTED){letresult=onRejected(this.rea儿子);if(resultinstanceofMyPromise){result.then(nextResolve,nextReject);}else{nextResolve(结果);}}}catch(e){nextReject(e);}//}//2.判断当前的状态是否是默认状态if(this.status===PENDING){if(this._isFunction(onResolved)){//this.onResolvedCallback=onResolved;this.onResolvedCallbacks.push(()=>{try{letresult=onResolved(this.value);if(resultinstanceofMyPromise){result.then(nextResolve,nextReject);}else{nextResolve(result);}}catch(e){nextReject(e);}});}//if(this._isFunction(onRejected)){//this.onRejectedCallback=onRejected;this.onRejectedCallbacks.push(()=>{try{letresult=onRejected(this.reason);if(resultinstanceofMyPromise){result.then(nextResolve,nextReject);}else{nextResolve(结果);下一个拒绝();}}catch(e){nextReject(e);}});//}}});}catch方法的详细解释其实就是then方法的失败回调函数的语法糖。如果需要同时使用then和catch方法,必须使用链式编程,否则会报错。可以在前面的promise对象Exceptionduringexecutioncatch(onRejected){returnthis.then(undefined,onRejected);}的then方法中捕获成功的回调函数为什么用catch最好用链式编程?因为then方法只有成功的回调,所以p2的状态会继承p1的状态,并且因为p2的状态是失败,没有对p2进行失败监听,所以报错letp1=newPromise(function(resolve,reject){//resolve();reject();});letp2=p1.then(function(){console.log("success");});p1.catch(function(){console.log("failure1");});Promise.all()Promise.all(params)feature参数是一个数组,数组元素是promise类型的数据。返回值是一个承诺。如果所有的promise都执行成功,则返回值是所有promise成功时返回的结果集合。如果承诺执行失败,则返回失败的承诺staticall(list){returnnewMyPromise(function(resolve,reject){letarr=[];让计数=0;for(leti=0;i
