ES6 generator

1. 今天在debug项目代码的时候发现generator函数arguments拿到的数据和传进来的request不一致,于是产生了怀疑,

yield call(option.before,request)

找了篇 ES6 中的生成器函数介绍用vscode对下面的代码进行debug

function* list() {
    for(var i = 0; i < arguments.length; i++) {
        yield arguments[i];
    }
    return "done.";
}

var o = list(1, 2, 3);
o.next(); // Object {value: 1, done: false}
o.next(); // Object {value: 2, done: false}
o.next(); // Object {value: 3, done: false}
o.next(); // Object {value: "done.", done: true}
o.next(); // Error: Generator has already finished

漫话JavaScript与异步·第三话——Generator:化异步为同步

2. 怎么去很好的理解generator内部的for循环

function* gee(age) {
  console.info('pp');
  for (var i = 0; i < 3; i++) {
    console.info('before');
    yield i;
    console.info('after');
  }
  yield 'lll';

  return 'xxx';
}

const it = gee(99);

console.info(it.next());
console.info(it.next());
console.info(it.next());
console.info(it.next());
console.info(it.next());

function* f() {
  console.log('执行了!');
}

var generator = f();

generator.next();

function* fn() {
  console.info("i:",i)
  for (var i = 0; true; i++) {
    var reset = yield i;
    console.info(reset)
    if (reset) {
      i = -1;
    }
  }
}

var g = fn();

console.info(g.next())
console.info(g.next())
console.info(g.next(true))
console.info(g.next())
console.info(g.next(true))
console.info(g.next())
console.info(g.next())

上述代码运行结果:
pp
before
{ value: 0, done: false }
after
before
{ value: 1, done: false }
after
before
{ value: 2, done: false }
after
{ value: 'lll', done: false }
{ value: 'xxx', done: true }
执行了!
i: undefined
{ value: 0, done: false } 1
undefined
{ value: 1, done: false } 2
true
{ value: 0, done: false } 3
undefined
{ value: 1, done: false } 4
true
{ value: 0, done: false } 5
undefined
{ value: 1, done: false } 6
undefined
{ value: 2, done: false } 7

最后一个例子可以看出除了第一次循环是从generator头部开始的,后面的循环都是在for循环中基于上一次的循环开始的(这个地方可以理解为串行的多个yield,不知道这么理解合不合适),

如果g.next(true)

function* fn() {
  console.info("i:",i)
  for (var i = 0; true; i++) { // 3. i加1, 为0
    var reset = yield i; // 1.从上一次循环的地方开始,reset 为true 
    // 4.回到这里,遇到了yield关键字,对外输出{ value: 0, done: false } ,暂停
    console.info(reset)
    if (reset) {
      i = -1; // 2.i为-1
    }
  }
}

最后一个例子来自于如阮一峰的ES6

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 简介 基本概念 Generator函数是ES6提供的一种异步编程解决方案,语法行为与传统函数完全不同。本章详细介绍...
    呼呼哥阅读 1,088评论 0 4
  • 本文作者就是我,简书的microkof。如果您觉得本文对您的工作有意义,产生了不可估量的价值,那么请您不吝打赏我,...
    microkof阅读 23,755评论 16 78
  • Generator函数 返回一个value和done结果value是yield的值done是booleanyiel...
    coolheadedY阅读 590评论 0 0
  • 窗台上的栀子花凋谢了,在这个百艳争芳的季节,这不得不说是一种无奈。 无奈它遇上了我,一个有过敏史的附庸风雅之人。因...
    宜言静好阅读 275评论 0 2
  • 1、CodeKit是incident57开发的一套前端开发助理工具,能够自动编译Less, Sass等前端代码,可...
    程序蜗牛阅读 1,238评论 0 0