在看过官方文档和《你不知道的javascript 中卷》之后，觉得还是应该写点什么总结一下，但是这个涉及到的点很多，感觉不太能够在单篇文章的篇幅之内能描述完全。
接下来我还是尽可能的描述一下，让大家理解过程，应用的地方有很多。
目录
自定义迭代器
生成器
自定义迭代器
比如迭代器，官网给出一个自定义迭代器的例子：
function makeRangeIterator(start = 0, end = Infinity, step = 1) {
let nextIndex = start;
let iterationCount = 0;
const rangeIterator = {
next: function() {
let result;
if (nextIndex < end) {
result = { value: nextIndex, done: false }
nextIndex += step;
iterationCount++;
return result;
}
return { value: iterationCount, done: true }
}
};
return rangeIterator;
}
let it = makeRangeIterator(1, 10, 2);
let result = it.next();
while (!result.done) {
console.log(result.value); // 1 3 5 7 9
result = it.next();
}
console.log("Iterated over sequence of size: ", result.value); // 5照着敲一下理解下，这里其实是为了讲解生成器做铺垫，已经构造出了返回的result对象中的两个属性，一个是value，一个是done。
官网给出的迭代器的解释：
迭代器和生成器
生成器
接下来我来重点解释下生成器：
来，我们开门见山，生成器就是一类特殊的函数，可以一次或多次启动和停止，并不一定非得要完成。
虽然自定义的迭代器是一个有用的工具，但由于需要显式地维护其内部状态，生成器函数提供了一个强大的选择：它允许你定义一个包含自有迭代算法的函数， 同时它可以自动维护自己的状态。
来看一下代码：
function* makeRangeIterator(start = 0, end = Infinity, step = 1) {
for (let i = start; i < end; i += step) {
yield i;
}
}
var a = makeRangeIterator(1,10,2)
a.next() // {value: 1, done: false}
a.next() // {value: 3, done: false}
a.next() // {value: 5, done: false}
a.next() // {value: 7, done: false}
a.next() // {value: 9, done: false}
a.next() // {value: undefined, done: true}好奇怪，这里出现来一个yield，这个是什么意思呢？yield大家暂时先理解为暂停并返回一个值的意思。
这里第一个a.next();启动生成器，执行到yield i暂停，并返回i，此时返回的对象里面的value是1
记住：每次调用next()，会返回一个新的Generator（生成器），但这个Generator只能迭代一次。
用形象化的语言描述：每次调用next()，就是提出一个问题，生成器要给我的下一个值是什么？而生成器返回的东西有两种返回方式，一种是yield返回，一种是return返回。
以第一次为例，回答问题：这里生成器返回给next(...)的东西为Generator对象{value: 1, done: false}，value值是yield表达式的值。
然后依次返回的Generator为
{value: 3, done: false}
{value: 5, done: false}
{value: 7, done: false}
{value: 9, done: false}
最后一次返回的value是undefined，done为true，表示结束。
{value: undefined, done: true}
最后的value为什么是undefined？因为函数结束了？？
生成器返回值来源就是两种，一种yield暂停返回值，一种是return返回值，这里循环结束只剩return了，因为函数没有显示返回，就是默认隐式返回undefined，所以这里是undefined。是不是最后一次返回的生成器对象value都是undefined呢？不是的，我们往下看吧！
理解了吗？接下来我们往下看来测试你是否理解了
function *foo(x) {
var y = x * (yield "Hello"); // 暂停并返回"Hello"
return y;
}
var it = foo(6);
var res = it.next(); // {value:"Hello", done:false}
console.log(res.value); // "Hello"
res = it.next(7); // {value:42, done:true}
console.log(res.value); // 42var it = foo(6);这里it是一个控制生成器的迭代器，当然你也可以理解为引用 it 指向生成器*foo(...)对象，每次构建这样的一个迭代器it，实际上就隐式的构建了生成器的一个实例，然后通过这个迭代器来控制这个生成器实例。
var res = it.next();留下一个问题，生成器*foo(...)要给我的下一个值是什么？去看生成器，yield "Hello"表达式回答了这个问题，执行到yield "Hello"的时候暂停，并返回value为"Hello"的Generator对象{value:"Hello", done:false}
res = it.next(7); 留下一个问题，生成器*foo(...)要给我的下一个值是什么？此时传入的7是赋值给了yield表达式，这里就是yield和next(...)的双向消息传递！！（关于双向消息传递我们下一个例子再讲）
此时没有yield来回答问题了，那么由 return 来回答！返回给next(...)的东西就由return返回。x为上一次的next传入的值6，yield表达式为本次next传入的7，所以y为42，return 42;
it.next(7)的执行返回的对象为{value:42, done:true}，因为函数结束了，done就为true。
记住：启动生成器时的第一个next()一定要用不带参数的next()，因为所有的浏览器都会丢弃传递给第一个next()的参数
看到这里，我想你应该理解了最后一次返回的时候value是undefined还是具体值的问题，就是看你生成器函数是否显式return，有就是你return的值，没有就是默认undefined.
相似例子说明：
function *foo(x) {
var y = x * (yield); // 暂停并返回undefined
return y;
}
var it = foo(6);
var res = it.next(); // {value:undefined, done:false}
console.log(res.value); // "Hello"
res = it.next(7); // {value:42, done:true}
console.log(res.value); // 42不同点就是只有yield，暂停并返回undefined。
如果你看懂了下一个例子，你就是理解了yield和next(...)的双向消息传递
function *foo() {
var x = yield 2;
++z;
var y = yield(x * z);
console.log(x, y, z);
}
var z = 1;
var it1 = foo();
var it2 = foo();
var val1 = it1.next().value; // 2, yield表达式暂停并返回2
var val2 = it2.next().value; // 2, yield表达式暂停并返回2
val1 = it1.next(val2 * 10).value; // 40
val2 = it2.next(val1 * 5).value; // 600
it1.next(val2 / 2); // y:300 20 300 3
it2.next(val1 / 4); // y:10 200 10 3val1 = it1.next(val2 * 10).value; //40
这里it1.next参数传进去val2*10=20，传进去20给yield表达式，然后赋值给x，所以x为20，然后++z，z为2，接着执行到下一个yield暂停，返回表达式的值yield(x * z)就是20*2=40，所以这里是40
val2 = it2.next(val1 * 5).value; // 600
这里it2.next传进去的是val1*5=200，传进去200给yield表达式，然后赋值给x，所以x为200，然后++z，z为3，接着执行到下一个yield暂停，返回表达式的值yield(x * z)就是200*3=600，所以这里是600
最后it1和it2迭代器再次next，这次就是执行到函数结束了，
it1的next执行后y为300，x，y，z分别为20， 300， 3
it2的next执行后y为10，x，y，z分别为200， 10， 3
最后生成器给出的值都为{value:undefined,done:true}，没有什么变量接收。
yield和next(...)双向消息传递就是这个next(...)传参数给上一次暂停的yield表达式，从而进行下一次计算，而执行到下一次yield的时候，暂停返回的生成器对象中的value键的值就是yield表达式的值。
yield ...和next(...)这一对组合起来，在生成器的执行过程中构成了一个双向消息传递系统。
知识扩展：
function * iterator02(end_value)
{
for(let i = 0; i < end_value; i++)
{
yield i;
}
}
for (let n of iterator02(10))
{
console.log(n) ;
}
let numbers = [ ... iterator02(20) ] ;
let [a, b, c, ... others] = iterator02(8) ;
console.log(numbers) ;
console.log(a, b, c) ;
console.log(others) ;运行结果：
记住：[...]语法，解构赋值语法，for循环和forEach等循环语法，实质就是iterator.next()，为什么这么说呢？
来看看，上面的例子稍微变一变！
function * iterator02(end_value)
{
for(let i = 0; i < end_value; i++)
{
yield i;
}
}
let a = iterator02(10);
let numbers = [...a];
console.log(a.next()); //这个是啥？？？最后打印
{value: undefined, done: true}
明明才准备启动生成器，结果迭代已经执行完了，充分说明这[...a]语法是不断next()直到结束！
记住，凡是能迭代的，原理是iterator.next()去迭代的，都会有
这个属性。
官网给的定义如下：
为了实现可迭代，一个对象必须实现 @@iterator 方法，这意味着这个对象（或其原型链中的任意一个对象）必须具有一个带 Symbol.iterator 键（key）的属性。
