小程序接口的promise化的实现方法


Posted in Javascript onDecember 11, 2019

最近在写微信小程序,为了能用上 async/await 方法,需要把微信提供的异步操作包装成 Promise 对象,为此写了一个简单的 promise(fie) 函数:

/**
 * @function promise - 将 wx 接口 promise 化
 * 
 * @param { String|Function } wxApi - 需要转换的接口/接口名
 * @param { Object|Any } [originParam = {}] - 原接口要求的参数对象
 * @param { Object|Any } [extra] - 接口要求的其他参数
 */
function promise(wxApi, originParam = {}, extra){
 const api = wxApi instanceof Function?
  wxApi:
  wx[wxApi];

 return new Promise((done, fail) =>
  api(Object.assign(
   originParam,
   {
    success: done,
    failed: fail
   }
  ),
  extra)
 );
}

正当我沾沾自喜、兴致冲冲地调用拍照接口测试时,控制台扔给我一个 “this._invokeMethod is not a Function” 的错误。显而易见,由于 wxApi 被当做参数传递,执行时的 this 与预期不一致,因此需要显式指定上下文,遂把函数再改改:

/**
 * @function promise - 将 wx 接口 promise 化
 * 
 * @param { String|Function } wxApi - 需要转换的接口/接口名
 * @param { Object|Any } [originParam = {}] - 原接口要求的参数对象
 * @param { Object|Any } [context = wx] - 执行上下文
 * @param { Object|Any } [extra] - 接口要求的其他参数
 */
function promise(wxApi, originParam = {}, context = wx, extra){
 const api = wxApi instanceof Function?
  wxApi:
  context[wxApi];

 return new Promise((done, fail) =>
  api.call(context, Object.assign(
   originParam,
   {
    success: done,
    failed: fail
   }
  ),
  extra)
 );
}

由于大部分接口都是 wx 的方法,因此这个 promise 方法在大多数情况下还是比较省事的。不过拍照接口是 cameraContext 的方法,所以传递的是 createCameraContext 方法的返回值:

/**
 * @function takePhoto - promise风格的拍照接口
 * 
 * @param { Object|Any } [options = {}] - 相机配置
 * 
 * @return {Promise}
 */
export function takePhoto(options = {}){
  const tempOptions = {
    quality: 'high',
    ...options
  }

 const cameraContext = createCameraContext();

 return promise(cameraContext.takePhoto, tempOptions, cameraContext);
}

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
JQuery 实现的页面滚动时浮动窗口控件
Jul 10 Javascript
javascript 四则运算精度修正函数代码
May 31 Javascript
javascript 在firebug调试时用console.log的方法
May 10 Javascript
js格式化货币数据实现代码
Sep 04 Javascript
一款基于jQuery的图片场景标注提示弹窗特效
Jan 05 Javascript
浅析jQuery 遍历函数,javascript中的each遍历
May 25 Javascript
JavaScript中闭包的写法和作用详解
Jun 29 Javascript
js实现下拉框效果(select)
Mar 28 Javascript
详解Vue.use自定义自己的全局组件
Jun 14 Javascript
vue+vuex+axios+echarts画一个动态更新的中国地图的方法
Dec 19 Javascript
javascript闭包的使用之按钮切换功能
Aug 30 Javascript
javaScript代码飘红报错看不懂?读完这篇文章再试试
Aug 19 Javascript
js中Function引用类型常见有用的方法和属性详解
Dec 11 #Javascript
jQuery实现验证用户登录
Dec 10 #jQuery
这样回答继承可能面试官更满意
Dec 10 #Javascript
jquery实现弹窗(系统提示框)效果
Dec 10 #jQuery
微信小程序 this.triggerEvent()的具体使用
Dec 10 #Javascript
jQuery实现消息弹出框效果
Dec 10 #jQuery
jQuery实现弹出层效果
Dec 10 #jQuery
You might like
php读取目录所有文件信息dir示例
2014/03/18 PHP
php中$美元符号与Zen Coding冲突问题解决方法分享
2014/05/28 PHP
php中操作memcached缓存进行增删改查数据的实现代码
2014/08/15 PHP
Yii框架引入coreseek分页功能示例
2019/02/08 PHP
PHP使用mysqli同时执行多条sql查询语句的实例
2019/03/22 PHP
PHP结合Redis+MySQL实现冷热数据交换应用案例详解
2019/07/09 PHP
javascript Xml增删改查(IE下)操作实现代码
2009/01/30 Javascript
javascripit实现密码强度检测代码分享
2013/12/12 Javascript
js随机生成字母数字组合的字符串 随机动画数字
2015/09/02 Javascript
全面解析Bootstrap中tab(选项卡)的使用方法
2016/06/06 Javascript
js 获取本地文件及目录的方法(推荐)
2016/11/10 Javascript
Omi v1.0.2发布正式支持传递javascript表达式
2017/03/21 Javascript
angular2系列之路由转场动画的示例代码
2017/11/09 Javascript
详解vue-cli 快速搭建单页应用之遇到的问题及解决办法
2018/03/01 Javascript
layui 表格的属性的显示转换方法
2018/08/14 Javascript
在AngularJs中设置请求头信息(headers)的方法及不同方法的比较
2018/09/04 Javascript
JS实现的检验身份证格式并输出出生日期,年龄,性别,出生地示例
2019/05/17 Javascript
Vue实现页面添加水印功能
2019/11/09 Javascript
vue 对axios get pust put delete封装的实例代码
2020/01/05 Javascript
序列化模块json代码实例详解
2020/03/03 Javascript
OpenLayers3实现地图鹰眼以及地图比例尺的添加
2020/09/25 Javascript
Vue实现简易购物车页面
2020/12/30 Vue.js
Python通过命令开启http.server服务器的方法
2017/11/04 Python
Python实现动态图解析、合成与倒放
2018/01/18 Python
浅谈Python黑帽子取代netcat
2018/02/10 Python
python3第三方爬虫库BeautifulSoup4安装教程
2018/06/19 Python
使用PyInstaller将Pygame库编写的小游戏程序打包为exe文件及出现问题解决方法
2019/09/06 Python
Python逐行读取文件内容的方法总结
2020/02/14 Python
python函数调用,循环,列表复制实例
2020/05/03 Python
Senreve官网:美国旧金山的奢侈手袋品牌
2019/03/21 全球购物
会计学个人自荐信模板
2013/12/13 职场文书
员工安全承诺书
2014/05/22 职场文书
房屋租赁授权委托书范本
2014/09/20 职场文书
2014年生产部工作总结
2014/12/17 职场文书
教师年终个人总结
2015/02/11 职场文书
Python实现查询剪贴板自动匹配信息的思路详解
2021/07/09 Python