迭代器,生成器和yield

迭代器, 生成器, yield 都是ES6 中的新语法

迭代器

迭代器由三个方法组成:

  1. hasNext() 是否还有下一个元素
  2. next() 迭代到下一个元素
  3. reset() 重置,一般用来抛出异常
    下面是一个简单的迭代器的例子:
    function Range(min,max){//[min,max)
    return {
    cur:min,
    hasNext:function(){
    return this.cur<max;
    },
    next:function(){
    return this.cur++;
    },
    reset:function(){
    throw new Error('unsupportted operation');
    }
    }
    }
    for(var iter = Range(1,10);iter.hasNext();){
    i = iter.next();
    console.log(i);
    }

可以看到, 每次在使用Range 函数的时候, 都要调用 .hasNext() 方法来判断一下是否还有下一个元素,之后再执行 .next() 函数。

生成器和yield

普通的函数以 function 来定义, 而生成器函数则是由 function* 来定义。可以说 生成器是一种更好的实现迭代器的方式。

yield 的作用: yield可以看出是“暂停”了函数的执行, 然后在调用函数的.next() 方法之后, 函数开始执行直到下一个 yield的表达式。
上边的生成器代码可以改变为:

function* Range(start, end) {
    for(var i = start; i<end;i ++) {
       yield i;    (2)
    }
}

var range = Range(1,10); // (1)
while(true) {
var ran = range.next(); // (3)
if(ran.done) break;
console.log(ran);
}
输出的结果 :

{ value: 1, done: false} 

value: 表示当前的值,即yield 之后的返回,
done: 表示当前的循环是否已经完成,true 为完成。
函数的运行方式为
(1), (3), (2), (3), (2), (3), (2)......
正好可以验证我们之前所说的 “暂停”

注意
如果我们调用range函数, 第一次的返回值是一个空的 generator Object

var kk = Range(1,10);
console.log(kk);

输出为:

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

推荐阅读更多精彩内容