ES6入門之Iterator和for...of

Iterator遍歷器

遍歷器（Iterator）就是這樣一種機制。它是一種接口，為各種不同的數據結構提供統一的訪問機制。任何數據結構只要部署Iterator接口，就可以完成遍歷操作（即依次處理該數據結構的所有成員）。

作用：

• 為各種數據結構，提供一個統一的、簡便的訪問接口
• 使得數據結構的成員能夠按某種次序排列
• ES6創造了一種新的遍歷命令for...of循環，Iterator接口主要供for...of消費

Iterator的遍歷過程：

（1）創建一個指針對象，指向當前數據結構的起始位置。也就是說，遍歷器對象本質上，就是一個指針對象。

（2）第一次調用指針對象的next方法，可以將指針指向數據結構的第一個成員。

（3）第二次調用指針對象的next方法，指針就指向數據結構的第二個成員。

（4）不斷調用指針對象的next方法，直到它指向數據結構的結束位置。

var it = makeIterator(['a', 'b']);

it.next() // { value: "a", done: false }
it.next() // { value: "b", done: false }
it.next() // { value: undefined, done: true }

function makeIterator(array) {
  var nextIndex = 0;
  return {
    next: function() {
      return nextIndex < array.length ?
        {value: array[nextIndex++], done: false} :
        {value: undefined, done: true};
    }
  };
}

在ES6中，有三類數據結構原生具備Iterator接口：數組、某些類似數組的對象、Set和Map結構。

可以覆蓋原生的Symbol.iterator方法，達到修改遍歷器行為的目的。

var str = new String("hi");

[...str] // ["h", "i"]

str[Symbol.iterator] = function() {
  return {
    next: function() {
      if (this._first) {
        this._first = false;
        return { value: "bye", done: false };
      } else {
        return { done: true };
      }
    },
    _first: true
  };
};

[...str] // ["bye"]
str // "hi"

for...of

for...of循環可以使用的范圍包括數組、Set和Map結構、某些類似數組的對象（比如arguments對象、DOM NodeList對象）、后文的Generator對象，以及字符串。