《JS高级程序设计》第7章 迭代器与生成器

AI滚雪球
100 阅读6分钟

第7章 迭代器与生成器

前言

  1. 在软件开发领域，“迭代” 的意思是按照顺序反复多次执行一段程序，通常会有明确的终止条件。

一、理解迭代

  1. 循环是迭代机制的基础，这是因为它可以指定迭代的次数，以及每次迭代要执行什么操作。
  2. Array.prototype.forEach()方法解决了单独记录索引和通过数组对象取得值的问题，但没有办法标识迭代何时终止。

二、迭代器模式

  1. 迭代器模式使开发者无须事先知道如何迭代就能实现迭代操作。
  2. 迭代器模式描述了一个方案，即可以把有些结构称为“可迭代对象”(iterable)，因为它们实现了正式的Iterable接口，而且可以通过迭代器Iterator消费。
  3. 把可迭代对象理解成数组或集合这样的集合类型的对象。它们包含的元素都是有限的，而且都具有无歧义的遍历顺序。
  4. 任何实现Iterable接口的数据结构都可以被实现Iterator接口的结构“消费”。
  5. 迭代器(iterator)是按需创建的一次性对象，用于迭代与其关联的可迭代对象。
let num = 1;
let obj = {};
console.log(num[Symbol.iterator]); // underfined
console.log(obj[Symbol.iterator]); // underfined

let str = 'abc';
let arr = [1, 2, 3];
let map = new Map().set(1, 2).set(2, 4);
let set = new Set().add(1, 2, 3);
let ele = document.getElementsByTagName('h1');

console.log(str[Symbol.iterator]); // ƒ [Symbol.iterator]() { [native code] }
console.log(arr[Symbol.iterator]); // ƒ values() { [native code] }
console.log(map[Symbol.iterator]); // ƒ entries() { [native code] }
console.log(set[Symbol.iterator]); // ƒ values() { [native code] }
console.log(ele[Symbol.iterator]); // ƒ values() { [native code] }

console.log(str[Symbol.iterator]()); // StringIterator {}
console.log(arr[Symbol.iterator]()); // Array Iterator {}
console.log(map[Symbol.iterator]()); // MapIterator {1 => 2, 2 => 4}
console.log(set[Symbol.iterator]()); // SetIterator {1}
console.log(ele[Symbol.iterator]()); // Array Iterator {}
  1. 迭代器 API 使用 next()方法在可迭代对象中遍历数据。
let item = ['1', '2'];
console.log(item[Symbol.iterator]); // ƒ values() { [native code] }
let k = item[Symbol.iterator]();
console.log(k); // Array Iterator {}
console.log(k.next()); // {value: '1', done: false}
console.log(k.next()); // {value: '2', done: false}
console.log(k.next()); // {value: undefined, done: true}

  1. 迭代器无须了解与其关联的可迭代对象的结构，只需要知道如何取得连续的值。

  2. 实现Iterable接口(可迭代协议)要求同时具备两种能力：支持迭代的自我识别能力和创建实现 Iterator接口的对象的能力。

  3. 如果对象原型链上的父类实现了Iterable接口，那这个对象也就实现了这个接口。

  4. 每次成功调用next()，都会返回一个IteratorResult对象，对象包含两个属性done和 value。只要迭代器到达done: true状态，后续调用next()就一直返回同样的值。

  5. 不同迭代器的实例相互之间没有联系，只会独立地遍历可迭代对象。

  6. 迭代器并不与可迭代对象某个时刻的快照绑定，而仅仅是使用游标来记录遍历可迭代对象的历程。如果可迭代对象在迭代期间被修改了，那么迭代器也会反映相应的变化。

  7. 迭代器维护着一个指向可迭代对象的引用，因此迭代器会阻止垃圾回收程序回收可迭代对象。

  8. 与Iterable接口类似，任何实现Iterator接口的对象都可以作为迭代器使用。

  9. Symbol.iterator属性引用的工厂函数会返回相同的迭代器。

  10. 可选的return()方法用于指定在迭代器提前关闭时执行的逻辑。return()方法必须返回一个有效的IteratorResult对象。可能的情况包括：

    1. for-of循环通过break、continue、return或throw提前退出。
    2. 解构操作并未消费所有值。

  11. 如果迭代器没有关闭，则还可以继续从上次离开的地方继续迭代。比如，数组的迭代器就是不能关闭的。

  12. 因为return()方法是可选的，所以并非所有迭代器都是可关闭的。

  13. 要知道某个迭代器是否可关闭， 可以测试这个迭代器实例的return属性是不是函数对象。

  14. 给一个不可关闭的迭代器增加这个方法并不能让它变成可关闭的。这是因为调用 return()不会强制迭代器进入关闭状态，但return()方法还是会被调用。

三、生成器

  1. 生成器拥有在一个函数块内暂停和恢复代码执行的能力。
  2. 生成器的形式是一个函数，函数名称前面加一个星号(*)表示它是一个生成器。
  3. 只要是可以定义函数的地方，就可以定义生成器。注意箭头函数不能用来定义生成器函数。标识生成器函数的星号不受两侧空格的影响。
  4. 调用生成器函数会产生一个生成器对象。
  5. value属性是生成器函数的返回值，默认值为undefined，可以通过生成器函数的返回值指定。
  6. 生成器函数只会在初次调用next()方法后开始执行。
  7. yield关键字可以让生成器停止和开始执行。
// 生成器函数在遇到 yield 关键字之前会正常执行
// 遇到 yield 关键字后，执行会停止，函数作用域的状态会被保留
// 停止执行的生成器函数只能通过在生成器对象上调用 next() 方法来恢复执行
function* generatorFn() {
  yield 'foo';
  yield 'bar';
  return 'baz';
}
let generatorObject = generatorFn();

// yield 生成的值会出现在 next() 方法返回的对象里
// 通过 yield 关键字退出的生成器函数会处在 done: false 状态
console.log(generatorObject.next()); // { value: 'foo', done: false }
console.log(generatorObject.next()); // { value: 'bar', done: false }

// 通过 return 关键字退出的生成器函数会处于 done: true 状态
console.log(generatorObject.next());   // { value: 'baz', done: true }
  1. yield关键字只能在生成器函数内部使用，yield关键字必须直接位于生成器函数定义中，否则会抛出错误。
  2. 生成器对象作为可迭代对象：
function* nTimes(n) {
  while (n--) {
    yield
  }
}
for (let _ of nTimes(3)) {
  console.log('foo');
}
// foo
// foo
// foo
  1. 除了可以作为函数的中间返回语句使用，yield关键字还可以作为函数的中间参数使用。
  2. 第一次调用next()传入的值不会被使用，因为这一次调用是为了开始执行生成器函数。
function* generatorFn(initial) {
  console.log(initial);
  console.log(yield);
  console.log(yield);
}
let generatorObject = generatorFn('foo');
generatorObject.next('bar');  // foo
generatorObject.next('baz');  // baz
generatorObject.next('qux');  // qux
  1. yield*实际上只是将一个可迭代对象序列化为一连串可以单独产出的值，能够迭代一个可迭代对象，从而一次产出一个值。
function* generatorFnA() {
  for (const x of [1, 2, 3]) {
    yield x;
  }
}
for (const x of generatorFnA()) {
  console.log(x);
}
// 1 2 3 

function* generatorFnB() {
  yield* [1, 2, 3];
}
for (const x of generatorFnB()) {
  console.log(x);
}
// 1 2 3
  1. yield*最有用的地方是实现递归操作，此时生成器可以产生自身。
function* nTimes(n) {
  if (n > 0) {
    yield* nTimes(n - 1);
    yield n - 1;
  }
}
for (const x of nTimes(3)) {
  console.log(x); // 0 1 2
}
  1. 因为生成器对象实现了Iterable接口，而且生成器函数和默认迭代器被调用之后都产生迭代器， 所以生成器格外适合作为默认迭代器：
class Foo {
  constructor() {
    this.values = [1, 2, 3];
  }
  *[Symbol.iterator]() {
    yield* this.values;
  }
}
const f = new Foo();
for (const x of f) {
  console.log(x);
}
// 1 2 3
  1. return()和throw()方法都可以用于强制生成器进入关闭状态。
  2. return()方法会强制生成器进入关闭状态。提供给return()方法的值，就是终止迭代器对象的值。
function* generatorFn() {
  for (const x of [1, 2, 3]) {
    yield x;
  }
}
const g = generatorFn();

console.log(g);            // generatorFn {<suspended>}
console.log(g.return(4));  // { done: true, value: 4 }
console.log(g);            // generatorFn {<closed>}
  1. 与迭代器不同，所有生成器对象都有return()方法，只要通过它进入关闭状态，就无法恢复了。
avatar
文章
阅读
粉丝