十、ES6 迭代器与生成器

---

一、迭代器与生成器

许多编程语言都将迭代数据的方式从使用 for 循环转变到使用迭代器对象， for 循环需要初始化变量以便追踪集合内的位置，而迭代器则以编程方式返回集合中的下一个项。迭代器能使操作集合变得更简单，因此 ES6 也将其添加到 JS 中。当新的数组方法与新的集合类型（例如 Set 与 Map ）结合时，迭代器就是高效数据处理的关键。并且还能在 JS 语言的很多新成分中找到迭代器：新增的 for-of 与它协同工作，扩展运算符（ … ）也使用了它，而它甚至还能让异步操作更易完成。

二、何为迭代器

迭代器是被设计专用于迭代的对象，带有特定接口。所有的迭代器对象都拥有 next() 方法，会返回一个结果对象。该结果对象有两个属性：对应下一个值的 value ，以及一个布尔类型的 done ，其值为 true 时表示没有更多值可供使用。迭代器持有一个指向集合位置的内部指针，每当调用了 next() 方法，迭代器就会返回相应的下一个值。

三、何为生成器

根据 ES6 制定的规则来书写迭代器，是有一点复杂的。幸好， ES6 还提供了生成器，让创建迭代器对象变得更简单。
生成器（ generator ）是能返回一个迭代器的函数。生成器函数由放在 function 关键字之后的一个星号（ * ）来表示，并能使用新的 yield 关键字。将星号紧跟在 function 关键字之后，或是在中间留出空格，都是没问题的，如下例：

// 生成器
function * createIterator(){
   
    yield 1
    yield 2
    yield 3
}

// 生成器可以像函数一样调用
// 但会返回一个迭代器
let iterator = createIterator()

console.log(iterator.next().value) // 1
console.log(iterator.next().value) // 2
console.log(iterator.next().value) // 3
console.log(iterator.next().value) // undefined

createIterator() 前面的星号让此函数变成一个生成器。 yield 关键字也是 ES6 新增的，指定了迭代器在被 next() 方法调用时应当按顺序返回的值。此例所生成的迭代器能够在next() 方法调用成功时返回三个不同的值： 先是 1 ，然后是 2 ，最后则是 3 。生成器能像任意其他函数那样被调用，正如示例中创建 iterator 的代码。
生成器函数最有意思的方面可能就是它们会在每个 yield 语句后停止执行。例如，此代码中yield 1 执行后，该函数将不会再执行任何操作，直到迭代器的 next() 方法被调用，此时才继续执行 yield 2 。在函数中停止执行的能力是极其强大的。

// 生成器
function * createIterator(items){
   
    for(let i=0; i<items.length; i++){
   
        yield items[i]
    }
}

// 生成器可以像函数一样调用
// 但会返回一个迭代器
let iterator = createIterator([1, 2, 3])

console.log(iterator.next()) 
console.log(iterator.next()) 
console.log(iterator.next()) 
console.log(iterator.next()) 
// 输出结果：
/*
{value: 1, done: false}
{value: 2, done: false}
{value: 3, done: false}
{value: undefined, done: true}
*/

此例传递了一个名为 items 的数组给 createIterator() 生成器函数。在此函数内， for循环在循环执行时从数组中返回元素给迭代器。每当遇到 yield ，循环就会停止；而每当iterator 上的 next() 方法被调用，循环就会再次执行到 yield 语句处。

yield 关键字只能用在生成器内部，用于其他任意位置都是语法错误，即使在生成器内部的函数中也不行，如下例：

function *creat