ES6新特性之Generator函数

1:基本概念

实际上Generator就是遍历器的一个生成器,我们可以用Generator来生成一个遍历器。Generator有两个明显的特点:第一个是function关键字与函数名之间有一个星号,一般而言是将两者写在一起的。第二个是在函数体内部有一个yield的关键字。

    function* generator(){
        yield 1;
        yield 2;
        return 3;  //return代表next的结束,对应着Generator遍历器的结束
    }
    const firstGenerator = generator();
    //
    firstGenerator.next()
    { value: 1, done: false }
    firstGenerator.next()
    { value: 2, done: false }
    firstGenerator.next()
    { value: 3, done: true }
    firstGenerator.next()
    { value: undefined, done: true }
    firstGenerator.next()
    { value: undefined, done: true }

2:执行过程

调用Generator函数后并不执行,第一次调用不执行,只有在调用next的时候才会真正的执行。

    function* generator(){
        console.log(1);
        yield 1;
        console.log(2);
        yield 2;
        console.log(3)
        return 3;
        console.log(4);
    }
    const gen = generator();

调用next方法开始执行,指针移向下一个状态

    function* generator(){
        console.log(1);
        yield 1;
        console.log(2);
        yield 2;
        console.log(3)
        return 3;
        console.log(4);
    }
    const gen = generator();
    gen.next();
    
    // 1
       { value: 1, done: false }

执行到yield或者是return语句,每一个next只能走到下一个yield或者是直接跨到了return。

    function* generator() {
      console.log(1);
      yield 1;
      console.log(2);
      yield 2;
      console.log(3);
      return 3;
      console.log(4);
    }
    const g = generator();
    g.next();
    g.next();
    
    // 1
       2
       { value: 2, done: false }

当next时,会从上一次暂停位置开始执行,直到return,return是退出next的一个标志。

    function* generator() {
      console.log(1);
      yield 1;
      console.log(2);
      yield 2;
      console.log(3);
      return 3;
      console.log(4);
    }
    
    const g = generator();
    g.next();
    g.next();
    g.next();
    g.next();
    
    // 1
       2
       3
       { value: undefined, done: true }

3:Generator方法

  • next,如果传了参数被当作上一个yield表达式的返回值,说明next是可以传参数的,如果没传时undefined。
        function* generator(x) {
          var y = 3 * (yield (x + 3));
          var z = yield (y / 2);
          return (x + y + z) * 2;
        }
        
        const gen1 = generator();
        
        
        // gen1.next(); 
           { value: NaN, done: false } 
           gen1.next();
           { value: NaN, done: false } */
           gen1.next();
           { value: NaN, done: false } */
           gen1.next();
           { value: undefined, done: true }
        function* generator(x) {
          var y = 3 * (yield (x + 3));
          var z = yield (y / 2);
          return (x + y + z) * 2;
        }
        
        const gen2 = generator(10);
        gen2.next();
        // { value: 13, done: false } 
        /*
        x = 10
        13 = 10 + 3
        */
        
        gen2.next(10);
        // { value: 15, done: false }
        /*
        y = 30
        15 = 3 * 10 / 2
        */
        
        gen2.next(10);
        // { value: 100, done: false }
        /*
        z = 10
        100 = (10 + 10 + 30) * 2
        */
    
  • throw,函数外抛出错误在Generator函数体内捕获
        function* generator(x) {
          try {
            yield;
          } catch (err) {
            console.log('inner error', err);
          }
        }
        
        const g = generator();
        g.next();
        // { value: undefined, done: false }
        
        g.throw(new Error('123'))
        // inner error Error: 123
    
  • return ,终结当前的Generator函数。

4:Generator函数应用

  • yield*,在Generator函数内部调用另一个Generator函数,无需手动遍历。
        function* generator1(){
          yield* [1, 2, 3];
        }
        generator1().next();
        // { value: 1, done: false } 
        
        function* generator2(){
          for (var value of [1, 2, 3]) {
            yield value;
          }
        }
        generator2().next();
        // { value: 1, done: false } 
        
        function* generator3(){
          yield [1, 2, 3];
        }
        generator3().next();
        // { value: Array(3), done: false } 
    

5:Generator函数应用

  • for of,遍历return前的数据
        function* generator() {
          yield 1;
          yield 2;
          yield 3;
          return 4;
        }
        
        for (let s of generator()) {
          console.log(s);
        }
        //  1
            2
            3
    
  • 状态机
        const status = function* () {
          while (true) {
            console.log('On');
            yield true;
            console.log('Off');
            yield false;
          }
        }();
        status.next();
        
        // On
           {value: true, done: false}
    
  • 网络请求
        import axios from 'axios';
        
        function* generator(){
          const url = 'https://xxx.xxx.com';
          const result = yield fetch(url);
          return result();
        }
    
  • 异步操作文件流
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 214,172评论 6 493
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 91,346评论 3 389
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 159,788评论 0 349
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 57,299评论 1 288
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 66,409评论 6 386
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 50,467评论 1 292
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 39,476评论 3 412
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 38,262评论 0 269
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 44,699评论 1 307
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 36,994评论 2 328
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 39,167评论 1 343
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 34,827评论 4 337
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 40,499评论 3 322
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 31,149评论 0 21
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 32,387评论 1 267
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 47,028评论 2 365
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 44,055评论 2 352

推荐阅读更多精彩内容