JavaScript异步co

上三篇分别介绍了PromiseGenerator,包括用Thunk自动执行Generator,本篇介绍用co模块将Generator和Promise结合起来,自动执行Generator。co模块参照这里,以前co模块返回的是Thunk,现在返回的是promise。安装命令:npm install co

你可以从Github上获取本篇例子代码。仍旧以读取文件为例,先用Promise来执行异步操作:

var fs = require('fs'); 
var readFile = function (fileName, options) {
    return new Promise(function (resolve, reject){
        fs.readFile(fileName, options, function(error, data){
            if (error) return reject(error);
            resolve(data);
        });
    });
};

readFile('./apples.txt', 'utf8').then(function(data){
    console.log(data);
    return readFile('./oranges.txt', 'utf8'); 
}).then(function(data){
    console.log(data);
}).catch(function(error){
    console.log(error);
});

先将异步函数fs.readFile封装成一个Promise对象,起名readFile。然后调用then依次执行异步操作。

但看起来一堆then,代码不够清晰,改成用Generator来定义异步操作的步骤:

var gen = function* () {
    var f1 = yield readFile('./apples.txt', 'utf8');
    console.log(f1);
    var f2 = yield readFile('./oranges.txt', 'utf8');
    console.log(f2);
};

var g = gen();
g.next().value.then(function(data) {
    g.next(data).value.then(function(data) {
        g.next(data);
    });
});

有了上两篇的基础,这些代码应该很容易就能看懂了。用Generator定义异步步骤,确实比Promise的then清晰很多,维护方便。但Generator的问题是,一步步执行next很麻烦。我们需要让Generator自动执行起来:

function run(gen){
    var g = gen();
    function next(data){
        var result = g.next(data);
        if (result.done) return result.value;
        result.value.then(function(data){
            next(data);
        });
    }
    next();
}
run(gen);

这些都是之前三篇介绍过的,炒炒冷饭。co源代码就是上面run方法的扩展, 因为源代码非常短,干脆直接贴出来看看它是怎么实现的:(为缩减篇幅,删除了源代码里的注释)

function co(gen) {  //co函数接受Generator函数作参数,最终返回一个 Promise 对象
  var ctx = this;
  var args = slice.call(arguments, 1);

  return new Promise(function(resolve, reject) {        //co函数返回的是一个Promise对象
    //先检查参数,如果是Generator函数就获得一个遍历器对象。
    //如果不是,或没有next方法,就将其转成一个状态为Resolved的Promise对象,并返回。
    if (typeof gen === 'function') gen = gen.apply(ctx, args);
    if (!gen || typeof gen.next !== 'function') return resolve(gen);

    onFulfilled();  //Generator函数的next方法被封装在此处

    function onFulfilled(res) {
      var ret;
      try {
        ret = gen.next(res);
      } catch (e) {
        return reject(e);
      }
      next(ret);    //关键在这里,详见下面next方法
      return null;
    }

    function onRejected(err) {
      var ret;
      try {
        ret = gen.throw(err);
      } catch (e) {
        return reject(e);
      }
      next(ret);
    }

    //该函数会无限递归,直到Generator函数执行完毕为止
    function next(ret) {
      //返回值的done属性为true表示Generator函数遍历完毕,返回Promise对象
      if (ret.done) return resolve(ret.value);

      //源码中定义了toPromise方法可以将Object,Array,Thunk,Generator转成Promise对象。
      //即你需要确保Generator函数的yield命令后面,是这些对象
      var value = toPromise.call(ctx, ret.value);

      //步步都确保已经是Promise对象后,执行then方法,通过onFulfilled再次调用该函数
      if (value && isPromise(value)) return value.then(onFulfilled, onRejected);

      //参数有误的话,捕捉异常,中止处理
      return onRejected(new TypeError('You may only yield a function, promise, generator, array, or object, '
        + 'but the following object was passed: "' + String(ret.value) + '"'));
    }
  });
}

上面co源代码加上注释后应该可以理解。用co模块自动执行Generator函数只需一行代码:co(gen);。是不是简单到令人发指?完整代码如下:

var fs = require('fs');
var co = require('co');

var readFile = function (fileName, options) {
    return new Promise(function (resolve, reject){
        fs.readFile(fileName, options, function(error, data){
            if (error) return reject(error);
            resolve(data);
        });
    });
};
var gen = function* () {
    var f1 = yield readFile('./apples.txt', 'utf8');
    console.log(f1);
    var f2 = yield readFile('./oranges.txt', 'utf8');
    console.log(f2);
};
co(gen);

先定义一个Promise对象将异步函数封装起来,用Generator函数定义异步操作流程,co模块里将yield命令后的异步操作包装成一个Promise对象,用then交回执行权来递归自动执行Generator函数。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 205,236评论 6 478
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 87,867评论 2 381
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 151,715评论 0 340
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 54,899评论 1 278
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 63,895评论 5 368
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,733评论 1 283
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 38,085评论 3 399
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,722评论 0 258
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 43,025评论 1 300
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,696评论 2 323
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,816评论 1 333
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,447评论 4 322
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 39,057评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 30,009评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,254评论 1 260
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 45,204评论 2 352
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,561评论 2 343

推荐阅读更多精彩内容

  • 异步编程对JavaScript语言太重要。Javascript语言的执行环境是“单线程”的,如果没有异步编程,根本...
    呼呼哥阅读 7,298评论 5 22
  • 本文首发在个人博客:http://muyunyun.cn/posts/7b9fdc87/ 提到 Node.js, ...
    牧云云阅读 1,679评论 0 3
  • 弄懂js异步 讲异步之前,我们必须掌握一个基础知识-event-loop。 我们知道JavaScript的一大特点...
    DCbryant阅读 2,695评论 0 5
  • 异步编程在JavaScript中非常重要。过多的异步编程也带了回调嵌套的问题,本文会提供一些解决“回调地狱”的方法...
    AlienZHOU阅读 27,432评论 2 52
  • 异步编程 程序执行分为同步和异步,如果程序每执行一步都需要等待上一步完成才能开始,此所谓同步。如果程序在执行一段代...
    faremax阅读 178评论 0 0