概要

js中的數組、對象，加上ES6中增加的Map、Set四種數據集合。 Iterator提供了一種機制，為各種不同的數據結構提供統一的訪問機制。任何數據結構只要部署Iterator接口，就可以完成遍歷操作。（依次操作）

作用：

• 為各種數據結構提供了統一的，簡便的訪問接口。
  
• 使得數據結構的成員能夠按照某種順序排列。
  
• ES6中增加了遍歷命令 for...of循環，Iterator接口主要供for...of消費

原理

1. 創建一個指針對象，指向當前數據結構的起始位置。 遍歷器對象本質上是一個指針。
2. 第一次調用next方法，返回數據結構的第一個對象。
   第二次調用next方法，返回數據結構的第二個對象。依次向下。
3. 不斷調用next方法，直到它指向數據結構的結束位置。 每次執行next方法，都會返回一個具有value和done屬性的對象。value是當前成員的值，done是一個表示是否結束循環的布爾值。

手寫Iterator接口

function iterator(arr){
    let index = 0;
    return {
        next:function(){
            return index < arr.length ?
            {value:arr[index++], done:false}:
            {value:undefined, done:true};
        }
    }
}
let arr = [1,2,3];
let it = iterator(arr);
 

使用

凡是具有Symbol.iterator屬性的數據結構都具有 Iterator接口

let arr = [1,2,3];
let set = new Set(['1','2']);
let map = new Map([['a':1],['b':2]]);

//Array Iterator {}
console.log( arr[Symbol.iterator]() );

//SetIterator {'1','2'}
console.log( set[Symbol.iterator]() );

//MapIterator {["a",1],["b",2]}
console.log( map[Symbol.iterator]() );          

//Object{value:1 , done:false }
arr[Symbol.iterator]().next();   
 

for...of循環

數據

 let arr = [1,2,3];
 /*
 * output: 1
 *         2  
 *         3  
 */
 for (let i of arr){
     console.log(i);
 }

Map

  let m = new Map();
  m.set('a',1);
  m.set('b',2);

  for(let [key,value] of m){
      console.log(key,value);
  }

es6筆記（6） Iterator 和 for...of循環