VPS参考测评推荐
专注分享VPS主机优惠信息
衡天云优惠活动
华纳云优惠活动

改进异步封装:使用返回值处理异步调用【k3】Border City In

主机参考:VPS测评参考推荐/专注分享VPS服务器优惠信息!若您是商家可以在本站进行投稿,查看详情!此外我们还提供软文收录、PayPal代付、广告赞助等服务,查看详情!
我们发布的部分优惠活动文章可能存在时效性,购买时建议在本站搜索商家名称可查看相关文章充分了解该商家!若非中文页面可使用Edge浏览器同步翻译!PayPal代付/收录合作

前几篇文章是关于微信小程序开发的。 于是有人问我:“我不懂小程序,你能给我写点别的吗?”

其实,你不需要太关注“小程序”,因为它们只是文章中的开发场景。 我们实际解决的问题不仅仅在小程序内部,解决问题的手段也与小程序无关!

1.问题

代理封装微信小程序的异步调用时还存在一个问题:

像wx.request()这样本来就有返回值的情况怎么处理? >如果请求在处理过程中需要取消,则使用wx.request()的返回值。

const requestTask = wx.request(...);if (...) { //由于某种原因必须取消这个请求 requestTask.abort();}

封装了 awx.request() 返回一个 Promise 对象,与 wx.request( ) 的原始返回值无关。 如果你希望能够取消请求,你需要检索wx.request()的原始返回值。 我应该怎么办?

function wxPromisify(fn) { return async function (args) { return new Promise((resolve,reject) => { constoriginalResult = fn({// ^^^^^^^^^^^^^^^ ^ ^^^^^^^^^^//// => 拒绝(错误例如,通过“容器”参数获取返回值,例如 return {promise,originalResult} 或 [promise,originalResult]; awx.request(params, outBox = {});马苏处理。 JS 是动态类型,这意味着你可以直接修改 Promise 对象并添加属性。 Promise.originalResult = ....

从用户的角度来看,大多数情况下不需要原始返回值。 目前,我们总是等待 awx.request(),而不是先分解然后等待(或 then())。 因此,方法1不是一个选择。

第二种方法是可行的,如果不需要原来的返回值,可以直接使用。 不过如果想要原来的返回值就有点麻烦了。 首先,您需要创建一个容器对象并将其传递。

第三种方法应该以最“不带感情色彩”的方式使用。 无论如何,Promise 对象都会派生出它们的真正价值,因此无论您是否想使用它们,都可以随意使用它们。

接下来,让我们实现第三种方法来转换 wxPromisify():

3. 失败的尝试

一开始非常简单。 以前我们所要做的就是返回 new Promise() ,但现在只需添加一个临时变量就足够了。

function wxPromisify(fn) { return async function (args) { const Promise = new Promise((resolve, Accept) => { // ^^^^^^^^^ ^^^^^^^ 承诺.originalResult = fn({//结果), 失败: ERR => 拒绝 (ERR)});}); 承诺返回。 // ^^^^^^^^^^^^^};}

然后我得到一个错误:

TypeError: Cannot set property 'originalResult' ofunknown

这个错误很容易易于理解、易于修改、易于创建。

本来我以为promise是一个可以直接访问的局部变量,所以在子作用域中使用它是没有问题的。 然而,这里忽略了这个子作用域位于构造函数内部的事实。 让我们做一些高层分析:

new Promise() 需要一个函数(我们称之为工厂)作为参数,但是这个工厂什么时候执行 new 注意,在 Promise() 创建一个 Promise 之后?实例,它不会主动调用该实例上的任何方法。 所以我们可以得出结论,工厂是在构建过程中执行的。 也就是说,此时 Promise 实例尚未创建,并且 Promise 正在引用 unfineed。

4.成功

现在我们明白了问题所在,我们继续分析。

工厂在Promise实例的构造过程中被调用,工厂直接执行函数体中的fn,并且fn的返回值是立即可用的,所以当Promise实例构造完成后,原来可以得到的返回值

接下来,让我们更改代码。

function wxPromisify(fn) { return async function (args) { letoriginalResult;// ^^^^^^^^^^^^^^^^^^ const Promise = new Promise((已解决,被拒绝) => { OriginalResult = Fn ({// ^^^^^^^^^^^^^^ ... (ARGS || {}),成功:Res => 解决 (res),失败:Er => 拒绝 (拒绝 (拒绝错误));^^^^^^原来的结果应该就这样发出来了!

但是有人会这样做(我在其他情况下见过):

注意:以下是一个错误的例子! function wxPromisify(fn) { return async function (args) { let Promise = new Promise();// ^^^^^^^^^^^^^^^^^^^^^^^^^^                                                 };}

这样做不会产生上面提到的 TypeError,但是外部获取到的 Promise 对象没有originalResult。具体原因和上面失败的尝试是一样的,所以我再解释一下,生成了两个 Promise 对象 > 这次我们以 wx.request() 为例。获取原始返回值。该返回值的主要目的实际上是提供一个 .abort() 方法来取消请求。您也可以参考 Axios 通过 cancelToken 实现的方法,这与 Axios 的处理方式类似。取消”。 cancelToken的本质就是上面的第二种方法,你传递一个“容器”对象来检索你想要的东西。 通过 Promise 对象检索它本质上与通过特殊的“容器”对象检索它相同,因此我们不会进一步解释。

推荐教程:《微信小程序》

PHP快速学习视频免费教程(从入门到精通)

如何学习PHP?我该如何开始使用 HP?我应该从哪里学习 PHP?如何才能快速学习 PHP? 这里有简单的 PHP 学习教程(从初学者到专家)。 您可以保存并下载您想学习的朋友。

下载

这几篇文章你可能也喜欢:

本文由主机参考刊发,转载请注明:改进异步封装:使用返回值处理异步调用【k3】Border City In https://zhujicankao.com/123714.html

【腾讯云】领8888元采购礼包,抢爆款云服务器 每月 9元起,个人开发者加享折上折!
打赏
转载请注明原文链接:主机参考 » 改进异步封装:使用返回值处理异步调用【k3】Border City In
主机参考仅做资料收集,不对商家任何信息及交易做信用担保,购买前请注意风险,有交易纠纷请自行解决!请查阅:特别声明

评论 抢沙发

评论前必须登录!