网站怎么设置百度收录,基于php做的网站下载,wordpress中的文章,企业网站的建设规划由一个问题引发的血案#xff1a; 手写源码实现Promise.prototype.finally。 我们知道#xff0c;对于promise来讲#xff0c;当状态敲定#xff0c;无论状态兑现或拒绝时都需要调用的函数#xff0c;可以使用Promise.prototype.finally的回调来实现。那么如何手写实现Pro…由一个问题引发的血案 手写源码实现Promise.prototype.finally。 我们知道对于promise来讲当状态敲定无论状态兑现或拒绝时都需要调用的函数可以使用Promise.prototype.finally的回调来实现。那么如何手写实现Promise.prototype.finally呢问题恐怕并不很简单本文主要做finally的细节和实现做一些详细的解读。
finally解决了什么问题 这可以让你避免在 promise 的 then() 和 catch() 处理器中重复编写代码。 以上为mdn中关于finally作用的解释。
finally的返回值 立即返回一个等效的 Promise 对象。 即finally返回的仍然是一个promise。
finally具体是怎么实现的 finally() 在内部调用其调用对象上的 then 方法。 这给了我们模拟实现finally的思路即我们调用then方法即可
Promise.prototype.finally function (onFinally) {return this.then((value) {},(err) {});
}
finally回调接收什么参数
就Promise.prototype.finally(onFinally)而言 onFinally 回调函数不接收任何参数。这种情况恰好适用于你不关心拒绝原因或兑现值的情况因此无需提供它。 因此我们可以对上面的代码增加回调执行这只需要再then的两个回调中都调用即可如下
Promise.prototype.finally function (onFinally) {return this.then((value) {onFinally();});}, (err) {onFinally();});
}
以上代码有一个问题 即虽然我们实现了无论兑现或者拒绝都调用 onFinally回调但是不能保证onFinally返回一个新的promise时onFinally已经执行完毕。 解决方案是使用Promise.resolve包裹一层如下
Promise.prototype.finally function (onFinally) {return this.then((value) {Promise.resolve(onFinally()).then(() {});}, (err) {Promise.resolve(onFinally()).then(() {});});
}
finally如何链式传递值
在上面的代码中我们已经实现了无论promise兑现或拒绝都调用同一个回调这看起来似乎已经达成了目标但不要忘了我们的finally仍然返回一个promise。 这个返回的promise如何接收之前的promise的值又如何传递值给后面的promise就成为了最重要的问题。 因此工作还没有结束对于返回值mdn给出了说明 返回等效的 Promise。如果处理程序抛出错误或返回被拒绝的 promise那么 finally() 返回的 promise 将以该值被拒绝。否则处理程序的返回值不会影响原始 promise 的状态。 finally() 调用通常是透明的不会更改原始 promise 的状态。例如 与 Promise.resolve(2).then(() 77, () {}) 不同它返回一个最终会兑现为值 77 的 promise而 Promise.resolve(2).finally(() 77) 返回一个最终兑现为值 2 的 promise。类似地与 Promise.reject(3).then(() {}, () 88) 不同它返回一个最终兑现为值 88 的 promise而 Promise.reject(3).finally(() 88) 返回一个最终以原因 3 拒绝的 promise。 也就是说finally返回的新promise与onFinally回调的返回值没有关系而是透明传递之前的promise的值。因此上面的代码变为
Promise.prototype.finally function (onFinally) {return this.then((value) {return Promise.resolve(onFinally()).then(() {return value;});}, (err) {return Promise.resolve(onFinally()).then(() {throw err;});});
} 关于三层return的解释
第一层returnfinally的返回值。 通过调用then得到一个新的promise并将其作为返回值。如果没有这个return整个finally就没有返回值。 第二层returnthen的返回值。 如果没有这个returnthen将以undefined作为返回的promise的兑现值这显然不符合预期。这里显然应该是返回一个新promise新promise应该将之前的promise的值透明传递。 第三层return新promise的传递值。 根据透明传递因此对于value直接return value对于err则直接throw err 全文完。
