EcmaScript6简述Generator

Generator是什么？

Generator是什么？有什么用？其实看下面这段代码，一看就明白了:

              {
              // genertaor基本定义
              let tell=function* (){
                yield 'a';
                yield 'b';
                return 'c'
              };
            
              let k=tell();
            
              console.log(k.next());//a,done:false
              console.log(k.next());//b,done:false
              console.log(k.next());//c,done:true
              console.log(k.next());//d,done:true
            }

这个函数，与其他函数，不一样的地方，就在于function*，有个 * 号，这也代表了，是Generator函数，其实，yield可以看成是一个断点，next为下一步，这跟我们在代码里写debugger一模一样，也没什么难的。

Generator与iterator迭代器

我们再继续研究代码，发现next这东西，iterator这迭代器也有呀，于是我们看官网，Generator函数返回的就是一个iterator迭代器，所以可以一直调用next方法。

            {
                let obj = {};
                obj[Symbol.iterator] = function*() {
                    yield 1;
                    yield 2;
                    yield 3;
                }

                for(let value of obj) {
                    console.log('value', value);
                }
            }

代码执行效果还是一样的，同样，也可以用for of循环，这样就不用一直next了。

应用场景

  let state=function* (){
    while(1){
      yield 'A';
      yield 'B';
      yield 'C';
    }
  }
  let status=state();
  console.log(status.next());
  console.log(status.next());
  console.log(status.next());
  console.log(status.next());
  console.log(status.next());

这段代码，可以一直轮询，输出A,B,C,A,B,C，这种方式，对于业务需求来说，还是可以用上。

最常见的，长轮询

{
  // 长轮询
  let ajax=function* (){
    yield new Promise(function(resolve,reject){
      setTimeout(function () {
        resolve({code:0})
      }, 200);
    })
  }

  let pull=function(){
    let genertaor=ajax();
    let step=genertaor.next();
    step.value.then(function(d){
      if(d.code!=0){
        setTimeout(function () {
          console.info('wait');
          pull()
        }, 1000);
      }else{
        console.info(d);
      }
    })
  }
  pull();
}

根据这里的if(d.code!=0)，照理说应该是后端返回参数，判断是否等于0，如果不等于0，就一秒钟之后再次执行这段代码，非常适合倒计时，每隔一秒种判断参数是否改变。