[JavaScript] generator

作者: 何幻 | 来源:发表于2016-03-05 08:08 被阅读71次

    ES6中的generator返回一个iterator/iterable,由“function*”定义,
    generator返回的对象,既可以看做一个iterator,也可以看做是一个iterable

    var iterator = {
    
        // iterator
        next: v => ({ value: xxx, done: xxx }),
    
        // iterable
        [Symbol.iterator]: () => iterator
    };
    
    iterator[Symbol.iterator]() === iterator
    

    例如:

    function* gen() { 
        yield 1;
        yield 2;
        yield 3;
    }
    var i = gen();
    
    // 把i视为iterator的例子
    console.log(i.next().value);    //1
    console.log(i.next().value);    //2
    console.log(i.next().value);    //3
    
    i = gen();
    
    // 把i视为iterable的例子
    console.log(...i);    //1 2 3
    

    注意:

    (1)作为对象属性的generator可以简写

    var obj = {
        * generatorMethod() {
        }
    };
    
    // 等价于
    let obj = {
        generatorMethod: function *() {
        }
    };
    

    (2)考虑到generator可以视为返回了一个iterator
    所以可以让objSymbol.iterator方法是一个generator
    obj就是一个iterable了。

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

    分析:因为obj的Symbol.iterator方法是一个generator
    调用后返回一个iterator
    所以,obj是一个iterable

    console.log(...obj);    //1 2 3
    

    (3)generator返回的iterator,它的next方法返回一个形如{ value:xxx, done:xxx }的对象
    generator中可以包含return,如果不写return,则末尾自动包含return
    (其中,return;相当于return undefined;

    如果nextyield返回的,则done===falsevalue就是yield后面的值,
    如果nextreturn返回的,则done===truevalue就是return后面的值

    如果已经是done===true,则再次调用iterator.next()不会出错
    而是返回{done:true, value:undefined}注意这里valueundefined

    (4)iterator.next是可以带参数的
    第一次调用iterator.next(v),参数v将会丢弃
    后面每次调用iterator.next(v),参数v就变成了上一个yield的�返回值。

    function* gen() { 
        var v1=yield 1;
        console.warn(v1);
    
        var v2=yield 2;
        console.warn(v2);
    
        var v3=yield 3;
        console.warn(v3);
    
        return 4;
    }
    
    var i = gen();
    
    //iterator
    console.log(i.next('a'));    //{done:false,value:1}
    console.log(i.next('b'));    //v1='b', {done:false,value:2}
    console.log(i.next('c'));    //v2='c', {done:false,value:3}
    console.log(i.next('d'));    //v3='d', {done:true,value:4}
    console.log(i.next('e'));    //{done:true,value:undefined}
    console.log(i.next('f'));    //{done:true,value:undefined}
    

    相关文章

      网友评论

        本文标题:[JavaScript] generator

        本文链接:https://www.haomeiwen.com/subject/xuynkttx.html