Generator的异步实现

整理了一下在学习和使用JS异步过程中的一些知识点。核心是在Generator实例的的回调中调度实例的下一步,同样的思想也能用于其它语言。比如Python中使用Generator实现了协程。C#早期有也这种TheadPool+Generator的异步实现。

什么是Generator

Generator 为生成器的意思,生成器函数的执行可以分段执行,函数在每一次调用后,函数只会执行到下一个位置再跳出函数。

Generator的简单使用

通过在申明方法的时候使用 * 和方法内使用yield 来表明自己的生成器函数身份。而调用生成器函数返回一个生成器。

function * buildGen(){
let r = yield 1;
console.log(`get: ${r}`);
return 2;
}
const gen = buildGen();
//gen 就是一个Generator,可以通过next 函数不断向下调用;
var next = gen.next();
console.log(next);
//{done:false,value:1}
next = gen.next("hello");
//get: hello
console.log(next);
//{done:true,value:2}

如上所示,调用buildGen后并没有立即执行,需要通过next函数才能工作,调用next()后返回一个显示当前完成状态和返回值的对象。

我们也可以通过向next 函数传递参数,完成向生成器传递信息。

Generator实现异步

通过Generator可以将JS的多重回调写法,变成同步写法。使异步使用更加易于理解。

function * buildGen(){
yield timeOutLogAsync(1000);
yield timeOutLogAsync(2000);
//yield readFileAsync('./test.txt');
}
function timeOutLogAsync(millseconds){
return (callback)=>{
setTimeout(callback,millseconds);
}
}
const gen = buildGen();
gen.next().value(()=>{
console.log(`first setTimeout is called`);
gen.next().value(()=>{
console.log(`sencond setTimeout is called`);
//gen.next();
});
});

以上代码还有一个问题,就是在需要手动执行next的来执行下一步,并且嵌套回调的结构也不利于阅读。不过可以通过引入自运行函数来解决这个问题。

function run(generator){
const gen = generator();
//内部实现了一个逆归调用
function next(err,value){
if(err){
throw err;
}
let handler = gen.next(value);
if(handler.done){
return;
}
handler.value(next);
}
next();
}
run(buildGen);

Thunk函数

在 JavaScript 语言中,Thunk 函数替换的不是表达式,而是多参数函数,将其替换成单参数的版本,且只接受回调函数作为参数。

//正常函数
fs.readFile(fileName,callback); const readFileThunk = function(fileName){
return (callback)=>{
fs.readFile(fileName,callback);
}
}
//thunk函数
readFileThunk(fileName)(callback);

thunkify 模块

thunkify模块提供了封装好的Thunk函数转换器。

npm install thunkify

使用如下

const thunkify = require("thunkify");
const fs = require("fs");
const readFileThunk = thunkify(fs.readFile);
readFileThunk('./test.txt')(function(err,value){
//...
});

源码见github

根据源码,thunkify 只能针对如fs.readFile(...args[],callback)这样将callback作为最后一个参数的标准函数,如果想要使用像setTimeout(callback,time)这样的函数,则需要我们做一个转换,如:

const executeTimeout = (time,callback) => setTimeout(callback,time);
const executeTimeoutThunk = thunkify(executeTimeout);
executeTimeoutThunk(1000)(function(){
console.log(new Date()) ;
});

co 模块

co模块是个流程管理模块。基于ES6的Generator和yield,能让我们用同步的形式编写异步代码。提供了上文中的run函数的作用。

npm install co


co(function*(){
var file1 = yield readFileThunk('./test.txt',{encoding:'utf8'});
console.log(file1);
var file2 = yield readFileThunk('./test2.txt',{encoding:'utf8'});
console.log(file2);
});

JS中Generator的学习小记的更多相关文章

  1. JS中childNodes深入学习

    原文:JS中childNodes深入学习 <html xmlns="http://www.w3.org/1999/xhtml"> <head> <ti ...

  2. js中关于prototype学习(2015年1月5号晚)

    prototype在js中为原型,只要是对象都有原型,最高原型为Object. 函数作为一特殊的对象,下面探讨prototype(原型)和function(函数)之间的关系. function A ( ...

  3. js中this指向学习总结

      在面向对象的语言中(例如Java,C#等),this 含义是明确且具体的,即指向当前对象.一般在编译期绑定. 然而js中this 是在运行期进行绑定的,这是js中this 关键字具备多重含义的本质 ...

  4. Js中Array数组学习总结

    第一次写博客...有点方... 小白一枚(是真的小白),自学前端,下面来说说我在学习过程中总结的一些数组操作,如果说哪有错误,请各位大神多多指出,小的虚心接受. 引用类型分为Object类型(所谓的对 ...

  5. js 中的yield

    yield是什么 yield是ES6的新关键字,使生成器函数执行暂停,yield关键字后面的表达式的值返回给生成器的调用者.它可以被认为是一个基于生成器的版本的return关键字. yield关键字实 ...

  6. js 正则学习小记之匹配字符串

    原文:js 正则学习小记之匹配字符串 今天看了第5章几个例子,有点收获,记录下来当作回顾也当作分享. 关于匹配字符串问题,有很多种类型,今天讨论 js 代码里的字符串匹配.(因为我想学完之后写个语法高 ...

  7. js 正则学习小记之匹配字符串优化篇

    原文:js 正则学习小记之匹配字符串优化篇 昨天在<js 正则学习小记之匹配字符串>谈到 个字符,除了第一个 个,只有 个转义( 个字符),所以 次,只有 次成功.这 次匹配失败,需要回溯 ...

  8. js 正则学习小记之匹配字符串字面量优化篇

    昨天在<js 正则学习小记之匹配字符串字面量>谈到 个字符,除了第一个 个,只有 个转义( 个字符),所以 次,只有 次成功.这 次匹配失败,需要回溯后用 [^"] 才能匹配成功 ...

  9. JavaScript学习12 JS中定义对象的几种方式

    JavaScript学习12 JS中定义对象的几种方式 JavaScript中没有类的概念,只有对象. 在JavaScript中定义对象可以采用以下几种方式: 1.基于已有对象扩充其属性和方法 2.工 ...

随机推荐

  1. Bootstrap Blazor 组件介绍 Table (一)自动生成列功能介绍

    Bootstrap Blazor 是一套企业级 UI 组件库,适配移动端支持各种主流浏览器,已经在多个交付项目中使用.通过本套组件可以大大缩短开发周期,节约开发成本.目前已经开发.封装了 70 多个组 ...

  2. 「刷题笔记」Tarjan

    贴一个讲得非常详细的\(tarjan\)入门教程 信息传递 讲个笑话:我之前用并查集求最小环过的这题,然后看见题目上有个\(tarjan\)标签 留下了深刻的印象:\(tarjan\)就是并查集求最小 ...

  3. 这可能是最为详细的Docker入门总结

    写在前面 毕设是关于区块链的,自然就用到了docker,感觉到了docker的强大.学习源于总结,所以找了一些资料,这篇文章原作写的不错,看了好多遍哈哈. 这可能是最为详细的Docker入门总结 市面 ...

  4. PyQt(Python+Qt)学习随笔: QDoubleSpinBox浮点数字设定部件简介

    专栏:Python基础教程目录 专栏:使用PyQt开发图形界面Python应用 专栏:PyQt入门学习 老猿Python博文目录 老猿学5G博文目录 在<PyQt(Python+Qt)学习随笔: ...

  5. PyQt(Python+Qt)学习随笔:树型部件QTreeWidget中判断项是否首列跨所有列展示的isFirstItemColumnSpanned方法

    老猿Python博文目录 专栏:使用PyQt开发图形界面Python应用 老猿Python博客地址 在前面<PyQt(Python+Qt)学习随笔:QTreeWidgetItem项是否首列跨所有 ...

  6. 第15.16节 PyQt(Python+Qt)入门学习:PyQt中的信号(signal)和槽(slot)机制以及Designer中的使用

    老猿Python博文目录 老猿Python博客地址 一.引言 前面一些章节其实已经在使用信号和槽了,但是作为Qt中最重要的机制也是Qt区别与其他开发平台的重要核心特性,还是非常有必要单独介绍. 二.信 ...

  7. IntelliJ IDEA2019.3.2破解/永久激活/安装教程

    我想大家用过史上最好的开发工具就是idea了,没有之一!看到大家都在找idea的激活教程,今天我也在这里跟大家分享一下. 本教程针对现在官网针对的版本是idea2019.3.2,为防止以后会更新破解失 ...

  8. 关于获取客户端IP问题

    //相关代码 1.HttpContext.Current.Request.ServerVariables["HTTP_X_FORWARDED_FOR"] 2.HttpContext ...

  9. window启动mongoDB

    windows启动mongo服务 建议使用docker,方便又快捷,可以查看我的其他文章有介绍 创建好日志文件夹后执行以下命令 mongod.exe --logpath "C:\mongod ...

  10. uniapp-父组件数组变化同步子组件视图渲染

    项目中子组件封装的是一个picker,父组件需要传数组到子组件中. 如果父组件的数组出现变更,视图中的子组件或许不能直接刷新渲染,需要反复弹起几下才能看到. 试过深度监听,但都没有用,ref也不知道为 ...