微信小程序利用co处理异步流程的方法教程


Posted in Javascript onMay 20, 2017

本文主要介绍的是关于微信小程序利用co处理异步流程的方法教程,分享出来供大家参考学习,需要的朋友们下面来看看详细的介绍:

co

co是一个基于ES6 Generator特性实现的【异步流程同步化】写法的工具库。

co需要使用Promise特性,所以,我们先来创建一个使用Promise来处理的异步方法:

function myAsyncFunc() {
 return new Promise(function (resolve, reject) {
 setTimeout(function () {
 console.log("myAsyncFunction done!");
 resolve({ 
 data: "Hello,World" 
 })
 }, 2000);
 });
}

然后,直接使用这个方法的话,就会如下,使用了then/catch的回调方式来处理调用结果和异常处理:

myAsyncFunc().then(function (result) {
 console.log(result.data); //Hello,World
}).catch(function (err) {
 //...
});

而如果是使用co的话,则会像这样:

co(function *() {

 try {
 var result = yield myAsyncFunc();
 console.log(result.data); //Hello,World
 } catch(e) {
 }

});

这样的写法,是不是就是我们非常熟悉的,比较符合逻辑思维习惯的同步写法了?

关于co的用法,在本文中我就不多展开了,有兴趣的朋友可以自行搜索相关资料。我今天要讲的是,如何在小程序环境下面成功的使用co。

1. 开启语言转译选项

由于要使用到ES6的generator,而又要为了兼容性,我们必须对ES6的语法进行降级转译,变成ES5。

微信小程序利用co处理异步流程的方法教程
开启语言转译选项

2. 引入generator支撑库

经过转译后的代码,需要依赖一个regeneratorRuntime,才能支持generator特性。Facebook开源的一个regenerator就是这样一个库,Github地址:https://github.com/facebook/regenerator/

你可以通过npm来下载这个regenerator库:

npm install regenerator

然后将下载文件中名为regenerator-runtime.js的文件拿出来,放到我们的小程序代码中去。

3.下载co和Promise库

接着,通过npm下载co库:

npm install co

将下载文件中名为co.js文件拿出来,放到我们的小程序代码中去。

因为需要依赖Promise,所以我们需要引入一个Promise实现库。在此我们选用一个小而兼容性好的库es6-promise。同样可以通过npm下载:

npm install es6-promise

将es6-promise.js放到我们的小程序代码中。

4.引入小程序代码中

使用前,将这些库正确的引入我们的代码:

const Promise = global.Promise = require('../../libs/es6-promise')
const regeneratorRuntime = global.regeneratorRuntime = require('../../libs/regenerator-runtime')
const co = require('../../libs/co')

好了,接下来就可以开始愉快的使用co进行编程了。

总结

好了,以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作能带来一定的帮助,如果有疑问大家可以留言交流,谢谢大家对三水点靠木的支持。

Javascript 相关文章推荐
JavaScript Eval 函数使用
Mar 23 Javascript
基于datagrid框架的查询
Apr 08 Javascript
JSON无限折叠菜单编写实例
Dec 16 Javascript
javascript在子页面中函数无法调试问题解决方法
Jan 17 Javascript
kindeditor编辑器点中图片滚动条往上顶的bug
Jul 05 Javascript
详解JS对象封装的常用方式
Dec 30 Javascript
基于Marquee.js插件实现的跑马灯效果示例
Jan 25 Javascript
利用babel将es6语法转es5的简单示例
Dec 01 Javascript
原生js实现移动端触摸轮播的示例代码
Dec 22 Javascript
Node错误处理笔记之挖坑系列教程
Jun 05 Javascript
详细讲解如何创建, 发布自己的 Vue UI 组件库
May 29 Javascript
JavaScript实现的联动菜单特效示例
Jul 08 Javascript
关于jQuery库冲突的完美解决办法
May 20 #jQuery
layui文件上传实现代码
May 20 #Javascript
为你的微信小程序体积瘦身详解
May 20 #Javascript
jquery.guide.js新版上线操作向导镂空提示jQuery插件(推荐)
May 20 #jQuery
使用node.js搭建服务器
May 20 #Javascript
layui表格实现代码
May 20 #Javascript
微信小程序新增的拖动组件movable-view使用教程
May 20 #Javascript
You might like
德生BCL3000的电路分析和打磨
2021/03/02 无线电
thinkphp制作404跳转页的简单实现方法
2016/09/22 PHP
浅谈php中fopen不能创建中文文件名文件的问题
2017/02/06 PHP
PHP中for循环与foreach的区别
2017/03/06 PHP
Laravel监听数据库访问,打印SQL的例子
2019/10/24 PHP
TP3.2.3框架使用CKeditor编辑器在页面中上传图片的方法分析
2019/12/31 PHP
JavaScript高级程序设计(第3版)学习笔记8 js函数(中)
2012/10/11 Javascript
关于jQuery参考实例 1.0 jQuery的哲学
2013/04/07 Javascript
jquery.cookie.js使用指南
2015/01/05 Javascript
浅谈js中的闭包
2015/03/16 Javascript
js过滤HTML标签完整实例
2015/11/26 Javascript
关于数据与后端进行交流匹配(点亮星星)
2016/08/03 Javascript
JS打开摄像头并截图上传示例
2017/02/18 Javascript
jQuery遍历节点方法汇总(推荐)
2017/05/13 jQuery
微信小程序获取用户openId的实现方法
2017/05/23 Javascript
JavaScript的六种继承方式(推荐)
2017/06/26 Javascript
vue自定义全局组件(自定义插件)的用法
2018/01/30 Javascript
微信小程序中上传图片并进行压缩的实现代码
2018/08/28 Javascript
Egg.js 中 AJax 上传文件获取参数的方法
2018/10/10 Javascript
微信小程序如何调用新闻接口实现列表循环
2019/07/02 Javascript
详解vue中v-on事件监听指令的基本用法
2020/07/22 Javascript
Python金融数据可视化汇总
2017/11/17 Python
关于Python正则表达式 findall函数问题详解
2018/03/22 Python
Python使用__new__()方法为对象分配内存及返回对象的引用示例
2019/09/20 Python
Python Sqlalchemy如何实现select for update
2020/10/12 Python
Python3.9.0 a1安装pygame出错解决全过程(小结)
2021/02/02 Python
Autopep8的使用(python自动编排工具)
2021/03/02 Python
VisionPros美国站:加拿大在线隐形眼镜和眼镜零售商
2020/02/11 全球购物
制药工程专业毕业生推荐信
2013/12/24 职场文书
民族精神月活动总结
2014/08/28 职场文书
群众路线教育实践活动个人对照检查材料思想汇报(社区班子)
2014/10/06 职场文书
市场督导岗位职责
2015/04/10 职场文书
环保建议书作文300字
2015/09/14 职场文书
2016年小学优秀班主任事迹材料
2016/02/29 职场文书
如何设计高效合理的MySQL查询语句
2021/05/26 MySQL
python图像处理基本操作总结(PIL库、Matplotlib及Numpy)
2021/06/08 Python