JavaScript高级程序设计(第四版)--学习记录之迭代器与生成器（上）

什么是迭代？

迭代的意思是按照顺序反复多次执行一段程序。循环是迭代机制的基础，因为它可以指定迭代的次数，以及每次迭代要执行的操作。

迭代器模式

迭代器模式描述了一个方案，可以把有些结构称为“可迭代对象” ，这些对象实现了正式的Iterable接口，而且可以通过迭代器Iterator消费。

迭代器是按需创建的一次性对象，每个迭代器都会关联一个可迭代对象，而迭代器会暴露迭代其关联可迭代对象的API。

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

以下内置类型实现了Iterable接口：

• 字符串
• 数组
• 映射
• 集合
• argumens对象
• NodeList等DOM集合类型

let num = 1; 
let obj = {}; 
// 这两种类型没有实现迭代器工厂函数
console.log(num[Symbol.iterator]); // undefined 
console.log(obj[Symbol.iterator]); // undefined 
let str = 'abc'; 
let arr = ['a', 'b', 'c']; 
let map = new Map().set('a', 1).set('b', 2).set('c', 3); 
let set = new Set().add('a').add('b').add('c'); 
let els = document.querySelectorAll('div'); 
// 这些类型都实现了迭代器工厂函数
console.log(str[Symbol.iterator]); // f values() { [native code] } 
console.log(arr[Symbol.iterator]); // f values() { [native code] } 
console.log(map[Symbol.iterator]); // f values() { [native code] } 
console.log(set[Symbol.iterator]); // f values() { [native code] } 
console.log(els[Symbol.iterator]); // f values() { [native code] } 
// 调用这个工厂函数会生成一个迭代器
console.log(str[Symbol.iterator]()); // StringIterator {} 
console.log(arr[Symbol.iterator]()); // ArrayIterator {} 
console.log(map[Symbol.iterator]()); // MapIterator {} 
console.log(set[Symbol.iterator]()); // SetIterator {} 
console.log(els[Symbol.iterator]()); // ArrayIterator {}

接收可迭代对象的原生语言特性包括：

• for-of循环
• 数组解构
• 扩展操作符
• Array.from()
• 创建集合
• 创建映射
• Promise.all()接收由期约组成的可迭代对象
• Promise.race()接收由期约组成的可迭代对象
• yield*操作符，在生成器中使用

let arr = ['foo', 'bar', 'baz']; 
// for-of 循环
for (let el of arr) { 
 console.log(el); 
} 
// foo 
// bar 
// baz 
// 数组解构
let [a, b, c] = arr; 
console.log(a, b, c); // foo, bar, baz 
// 扩展操作符
let arr2 = [...arr]; 
console.log(arr2); // ['foo', 'bar', 'baz'] 
// Array.from() 
let arr3 = Array.from(arr); 
console.log(arr3); // ['foo', 'bar', 'baz'] 
// Set 构造函数
let set = new Set(arr); 
console.log(set); // Set(3) {'foo', 'bar', 'baz'} 
// Map 构造函数
let pairs = arr.map((x, i) => [x, i]); 
console.log(pairs); // [['foo', 0], ['bar', 1], ['baz', 2]] 
let map = new Map(pairs); 
console.log(map); // Map(3) { 'foo'=>0, 'bar'=>1, 'baz'=>2 } 
如果对象原型链上的父类实现了 Iterable 接口，那这个对象也就实现了这个接口：
class FooArray extends Array {} 
let fooArr = new FooArray('foo', 'bar', 'baz'); 
for (let el of fooArr) { 
 console.log(el); 
} 
// foo 
// bar 
// baz

迭代器API使用next()方法在可迭代对象中遍历数据。next()方法返回的迭代器对象IteratorResult 包含两个属性：done 和 value。done 是一个布尔值，表示是否还可以再次调用 next()取得下一个值；value 包含可迭代对象的下一个值（done 为false），或者undefined（done 为 true）。done: true 状态称为“耗尽”。

// 可迭代对象
let arr = ['foo', 'bar']; 
// 迭代器工厂函数
console.log(arr[Symbol.iterator]); // f values() { [native code] } 
// 迭代器
let iter = arr[Symbol.iterator](); 
console.log(iter); // ArrayIterator {} 
// 执行迭代
console.log(iter.next()); // { done: false, value: 'foo' } 
console.log(iter.next()); // { done: false, value: 'bar' } 
console.log(iter.next()); // { done: true, value: undefined }

提前终止迭代器的方式：

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

  class Counter { 
   constructor(limit) { 
   this.limit = limit; 
   } 
   [Symbol.iterator]() { 
   let count = 1, 
   limit = this.limit; 
   return { 
   next() { 
   if (count <= limit) { 
   return { done: false, value: count++ }; 
   } else { 
   return { done: true }; 
   } 
   }, 
   return() { 
   console.log('Exiting early'); 
   return { done: true }; 
   } 
   }; 
   } 
  } 
  let counter1 = new Counter(5); 
  for (let i of counter1) { 
   if (i > 2) { 
   break; 
   } 
   console.log(i); 
  }
  // 1 
  // 2 
  // Exiting early 
  let counter2 = new Counter(5); 
  try { 
   for (let i of counter2) { 
   if (i > 2) { 
   throw 'err'; 
   } 
   console.log(i); 
   } 
  } catch(e) {} 
  // 1 
  // 2 
  // Exiting early 
  let counter3 = new Counter(5); 
  let [a, b] = counter3; 
  // Exiting early

  并非所有迭代器都是可关闭的。要知道某个迭代器是否可关闭，可以测试这个迭代器实例的 return 属性是不是函数对象。不过，仅仅给一个不可关闭的迭代器增加这个方法并不能让它变成可关闭的。这是因为调用 return()不会强制迭代器进入关闭状态。即便此，

  return() 方法还是会被调用。

  let a = [1, 2, 3, 4, 5]; 
  let iter = a[Symbol.iterator](); 
  iter.return = function() { 
   console.log('Exiting early'); 
   return { done: true };
  }; 
  for (let i of iter) { 
   console.log(i); 
   if (i > 2) { 
   break 
   } 
  } 
  // 1 
  // 2 
  // 3 
  // 提前退出
  for (let i of iter) { 
   console.log(i); 
  } 
  // 4 
  // 5