微信小程序利用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 相关文章推荐
ASP 过滤数组重复数据函数(加强版)
May 31 Javascript
JS中Date日期函数中的参数使用介绍
Jan 02 Javascript
jquery sortable的拖动方法示例详解
Jan 16 Javascript
使用jquery实现放大镜效果
Sep 02 Javascript
JavaScript字符串对象toUpperCase方法入门实例(用于把字母转换为大写)
Oct 17 Javascript
javascript处理a标签超链接默认事件的方法
Jun 29 Javascript
jqTransform美化表单
Oct 10 Javascript
Highcharts学习之数据列
Aug 03 Javascript
AngularJS 打开新的标签页实现代码
Sep 07 Javascript
学习jQuery中的noConflict()用法
Sep 28 jQuery
详解VScode编辑器vue环境搭建所遇问题解决方案
Apr 26 Javascript
vue插槽slot的简单理解与用法实例分析
Mar 14 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
php实现的一个很好用HTML解析器类可用于采集数据
2013/09/23 PHP
php cookie使用方法学习笔记分享
2013/11/07 PHP
php将html转成wml的WAP标记语言实例
2015/07/08 PHP
php精确的统计在线人数的方法
2015/10/21 PHP
基于win2003虚拟机中apache服务器的访问
2017/08/01 PHP
PHP Pipeline 实现中间件的示例代码
2020/04/26 PHP
JavaScript编程开发中的五个实用小技巧
2010/07/22 Javascript
广泛收集的jQuery拖放插件集合
2012/04/09 Javascript
JS二维数组的定义说明
2014/03/03 Javascript
Jquery实现的角色左右选择特效
2014/05/21 Javascript
javascript实现漂亮的拖动层,窗口拖拽特效
2015/04/24 Javascript
JS实现超精简响应鼠标显示二级菜单代码
2015/09/12 Javascript
学习Javascript面向对象编程之封装
2016/02/23 Javascript
[js高手之路]从原型链开始图解继承到组合继承的产生详解
2017/08/28 Javascript
angularjs 动态从后台获取下拉框的值方法
2018/08/13 Javascript
vue-cli监听组件加载完成的方法
2018/09/07 Javascript
详解使用JWT实现单点登录(完全跨域方案)
2019/08/02 Javascript
基于javascript实现碰撞检测
2020/03/12 Javascript
node使用async_hooks模块进行请求追踪
2021/01/28 Javascript
[00:34]DOTA2上海特级锦标赛 Spirit战队宣传片
2016/03/04 DOTA
python实现网页链接提取的方法分享
2014/02/25 Python
python如何实现excel数据添加到mongodb
2015/07/30 Python
在Python程序和Flask框架中使用SQLAlchemy的教程
2016/06/06 Python
浅谈Python中range和xrange的区别
2017/12/20 Python
Python环境Pillow( PIL )图像处理工具使用解析
2019/09/12 Python
Python中实现一行拆多行和多行并一行的示例代码
2020/09/06 Python
施华洛世奇天猫官方旗舰店:SWAROVSKI
2017/04/17 全球购物
Bibloo奥地利:购买女装、男装、童装、鞋和配件
2018/10/18 全球购物
一套PHP的笔试题
2013/05/31 面试题
幼儿园老师辞职信
2014/01/20 职场文书
自立自强的名人事例
2014/02/10 职场文书
企业晚会策划方案
2014/05/29 职场文书
销售活动策划方案
2014/08/26 职场文书
学生上课看漫画的检讨书
2014/09/26 职场文书
全国法院系统开展党的群众路线教育实践活动综述(全文)
2014/10/25 职场文书
小学五年级语文上册教学计划
2015/01/22 职场文书