JavaScript学习之路11_Generator

函数

先理解函数：
先看例子：
函数一段完整的代码，调用一个函数就是传入参数，然后返回结果。

function foo(x){
    return x*x;
}
var f1 = foo(2); //调用函数，结果是4

在调用函数的过程中，如果函数没有遇到return或者是隐含的return，那么控制权无法交回被调用的代码。

Generator

Generator其实和函数是很像的，看一下例子：

function* fun(x){
    yield x + 1;
    yield x + 2;
    return yield x + 3;
}

var f = fun(2);
f.next(); //3
f.next();//4
f.next();//5

备注：

Generator关键字是function*，要比function多一个*。
并且除了return，还可以使用yield返回多次。
举例说明：

//斐波拉契数列
//0 1 1 2 3 5 8 13 21 34 ...
正常使用函数：
function fib(max){
    var 
        t,
        a = 0,
        b = 1,
        arr = [0, 1];
    while(arr.length < max){
        t = a + b;
        a = b;
        b = t;
        arr.push(t);
    }
    return arr;
}

//使用Generator
function* fib(max){
    var 
        t,
        a = 0,
        b = 1,
        n = 1;
    while(n < max){
        yield a;
        t = a + b;
        a = b;
        b = t;
        n++;
    }
    return n;
}

fib(5); // fib {[[GeneratorStatus]]: “suspended”, [[GeneratorReceiver]]: Window}
结果不是我们想要的，为什么呢？
直接调用一个generator和调用函数不一样，fib(5)仅仅是创建了一个generator对象，还没有去执行它。
generator有两个方法，一个是使用next方法。

var f = fib(5);
f.next(); // {value: 0, done: false}
f.next(); // {value: 1, done: false}
f.next(); // {value: 1, done: false}
f.next(); // {value: 2, done: false}
f.next(); // {value: 3, done: true}

解析：
next()方法会执行generator的代码，然后，每次遇到yield x;就返回一个对象{value: x, done: true/false}，然后“暂停”。返回的value就是yield的返回值，done表示这个generator是否已经执行结束了。如果done为true，则value就是return的返回值。
第二个方法是直接用for … of循环迭代generator对象，这种方式不需要我们自己判断done：

for (var x of fib(5)) {
    console.log(x); // 依次输出0, 1, 1, 2, 3
}

generator和普通函数相比，有什么用？

因为generator可以在执行过程中多次返回，所以它看上去就像一个可以记住执行状态的函数，利用这一点，写一个generator就可以实现需要用面向对象才能实现的功能。

练习

要生成一个自增的ID，可以编写一个next_id()函数：

var current_id = 0;

function next_id() {
    current_id ++;
    return current_id;
}

由于函数无法保存状态，故需要一个全局变量current_id来保存数字。
不用闭包，试用generator改写：

function* next_id() {
    var x = 1;
    while(true){
        yield x++;
    }
}

测试就可以通过。