微信小程序利用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调用WebService的示例
Apr 07 Javascript
某页码显示的helper 少量调整,另附js版
Sep 12 Javascript
jQuery实现可展开合拢的手风琴面板菜单
Sep 15 Javascript
jQuery模拟完美实现经典FLASH导航动画效果【附demo源码下载】
Nov 09 Javascript
js对字符串进行编码的方法总结(推荐)
Nov 10 Javascript
Vue自定义图片懒加载指令v-lazyload详解
Dec 31 Javascript
Vue.js中组件中的slot实例详解
Jul 17 Javascript
zTree树形菜单交互选项卡效果的实现方法
Dec 25 Javascript
ReactNative实现Toast的示例
Dec 31 Javascript
解决js相同的正则多次调用test()返回的值却不同的问题
Oct 10 Javascript
JavaScript静态作用域和动态作用域实例详解
Jun 17 Javascript
微信小程序实现组件顶端固定或底端固定效果(不随滚动而滚动)
Apr 09 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之第十天
2006/10/09 PHP
Apache, PHP在Windows 9x/NT下的安装与配置 (一)
2006/10/09 PHP
NOT NULL 和NULL
2007/01/15 PHP
php中json_encode中文编码问题分析
2011/09/13 PHP
php使用array_search函数实现数组查找的方法
2015/06/12 PHP
在PHP语言中使用JSON和将json还原成数组的方法
2016/07/19 PHP
Centos 6.5系统下编译安装PHP 7.0.13的方法
2016/12/19 PHP
php7安装yar扩展的方法详解
2017/08/03 PHP
JavaScript学习点滴 call、apply的区别
2010/10/22 Javascript
JQuery调webservice实现邮箱验证(检测是否可用)
2013/05/21 Javascript
Jquery 类网页微信二维码图块滚动效果具体实现
2013/10/14 Javascript
checkbox全选所涉及到的知识点介绍
2013/12/31 Javascript
悬浮广告方法日常收集整理
2016/03/18 Javascript
jQuery实用密码强度检测
2017/03/02 Javascript
如何去除富文本中的html标签及vue、react、微信小程序中的过滤器
2018/11/21 Javascript
JavaScript变量提升和严格模式实例分析
2019/01/27 Javascript
vue-iview动态新增和删除的方法
2020/06/17 Javascript
探索node之事件循环的实现
2020/10/30 Javascript
python中的yield使用方法
2014/02/11 Python
Python 实现淘宝秒杀的示例代码
2018/01/02 Python
Python读取MRI并显示为灰度图像实例代码
2018/01/03 Python
Python数据分析之双色球中蓝红球分析统计示例
2018/02/03 Python
实例讲解Python爬取网页数据
2018/07/08 Python
一篇文章搞定Python操作文件与目录
2019/08/13 Python
tensorflow查看ckpt各节点名称实例
2020/01/21 Python
Python如何使用turtle库绘制图形
2020/02/26 Python
零基础学python应该从哪里入手
2020/08/11 Python
Adobe Html5 Extension开发初体验图文教程
2017/11/14 HTML / CSS
法国和欧洲海边和滑雪度假:Pierre & Vacances
2017/01/04 全球购物
安全检查验收制度
2014/01/12 职场文书
向领导表决心的话
2014/03/11 职场文书
《沉香救母》教学反思
2014/04/19 职场文书
忠诚与背叛观后感
2015/06/04 职场文书
pytorch通过训练结果的复现设置随机种子
2021/06/01 Python
Java SSM配置文件案例详解
2021/08/30 Java/Android
MySQL约束(创建表时的各种条件说明)
2022/06/21 MySQL