ES6学习笔记——Generator函数的异步用法

什么是异步编程

异步编程可以理解为:一个任务A执行到一半时,交出自己的执行权并处于“暂停”状态,转而去执行其他的任务(任务B),然后再条件准备好时,再回过头来执行任务A

在ES6之前,我们一搬会有以下几种方法来实现异步编程:

  1. 回掉函数
  2. 事件监听
  3. 发布/订阅
  4. Promise 对象(第三方库)

但是在ES6时代,又多了一种异步编程的选择—— Generator 函数

Generator 函数实现一个基本的异步编程

在上一篇中说过,Generator 函数就像一个状态机,调用后返回的遍历器对象每调用一次 next() 方法,遍历器中的状态指针才会向后移动到下一个状态,并执行下一个状态之前的代码,且不印象后面的代码,这就为异步编程提供了良好的条件,使异步编程的书写变得如同同步编程一般

function* generator() {
    console.log('start')
    var res = yield loop();
    console.log('end')
}

function loop() {
    console.time('loop');
    for (var i = 0; i < 1000000000; i ++) {}
    console.timeEnd('loop');
}

var g = generator();
g.next();
g.next();

// start
// loop: 540.537ms
// end

上面的代码中,g 是 generator 方法返回的遍历器对象。第一次调用 next() 方法时,会先执行 yield 之前的代码 TASK A,然后执行 yield 语句表达式 yield loop(),并执行耗时函数 loop

第二次调用 next() 方法时,会等待第一个 next() 方法完成再执行 generator 方法内后面的代码

但是从上面的代码可以看出,要想用 Generator 函数实现异步编程,需要手动地来控制状态指针的后移,在实际工作中会不方便,所以就需要一个方法让 Generator 函数能够自动往后执行

基于 Promise 对象自动执行 Generator 函数

现将上面代码改造成基于 Promise 对象的 Generator 函数

function* generator() {
    console.log('start')
    var res = yield loop();
    console.log('end')
}

function loop() {
    return new Promise(function(resolve, reject) {
        try {
            console.time('loop');
            for (var i = 0; i < 1000000000; i ++) {}
            console.timeEnd('loop');
        } catch (e) {
            reject(e);
        }
        resolve();
    })
}

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

// start
// loop: 2576.482ms
// end

上面代码中, loop 方法被改造成一个返回 Promise 对象的方法,这样在调用第一个 next() 方法时,返回的对象的 value 熟悉就会使一个 Promise 对象,可以使用 then() 方法,再 then() 中再次调用 next() ,亦可以达到未改动之前的异步效果

基于以上改动后的代码,将其最后执行的方法封装成可通用的代码段

function run(generator){
  var g = generator();

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

  next();
}

run(generator);

上面这段代码中的 data 是需要传递的参数,还记得在上一篇中所说的 next() 方法中参数的意义吗?戳链接直达上一篇:

ES6学习笔记——Generator函数语法

需要注意的是,使用上面这段自动执行代码,yield 语句返回的 value 都必须是一个 Promise 对象,否则是无法执行的

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

推荐阅读更多精彩内容

  • 在此处先列下本篇文章的主要内容 简介 next方法的参数 for...of循环 Generator.prototy...
    醉生夢死阅读 1,436评论 3 8
  • 异步编程对JavaScript语言太重要。Javascript语言的执行环境是“单线程”的,如果没有异步编程,根本...
    呼呼哥阅读 7,293评论 5 22
  • 简介 基本概念 Generator函数是ES6提供的一种异步编程解决方案,语法行为与传统函数完全不同。本章详细介绍...
    呼呼哥阅读 1,065评论 0 4
  • 官方中文版原文链接 感谢社区中各位的大力支持,译者再次奉上一点点福利:阿里云产品券,享受所有官网优惠,并抽取幸运大...
    HetfieldJoe阅读 6,368评论 9 19
  • 本文作者就是我,简书的microkof。如果您觉得本文对您的工作有意义,产生了不可估量的价值,那么请您不吝打赏我,...
    microkof阅读 23,713评论 16 78