迭代器(lterator)是一種介面,為各種不同的資料結構提供統一的訪 問機制。任何資料結構只要部署Iterator 介面，就可以完成遍歷操作。

1)ES6創造了一種新的遍歷命令for...of迴圈，Iterator介面主要供for...of消費

2)原生具備iterator介面的資料(可用for...of遍歷)

a) Array

b) Arguments

c) Set

d) Map

e) tring

f) TypedArray

g) NodeList

3)工作原理

a)建立一個指標物件，指向當前資料結構的起始位置

b)第一次呼叫對 象的next方法，指標自動指向資料結構的第一個成員

c) 接下來不斷呼叫next方法，指標一直往後移動，直到指向最後一個成員

d)每呼叫next方法返回一個包含value和done屬性的物件

注:需要自定義遍歷資料的時候，要想到迭代器。

栗子：

 const arr = ['火鍋','烤肉','奶茶','辣條'];
 for(let v of arr){
 	console.log(v);
 }
console.log(arr);

只要物件裡有Symbol的Iterator屬性就可以for...of

原理：

let iterator = arr[Symbol.iterator]();
console.log(iterator);

console.log(iterator.next());
console.log(iterator.next());
console.log(iterator.next());
console.log(iterator.next());
console.log(iterator.next());
 

done為true表示遍歷已經完成。

自定義遍歷資料

栗子：

//自定義遍歷資料
//使用for...of遍歷，每次返回的結果是數組裡的一個成員
//宣告一個物件
const meishi = {
    name:'我愛美食',
    status: [
        '火鍋',
        '烤肉',
        '奶茶',
        '辣條'
    ],
   /* a)建立一個指標物件，指向當前資料結構的起始位置

	  b)第一次呼叫對 象的next方法，指標自動指向資料結構的第一個成員

      c) 接下來不斷呼叫next方法，指標一直往後移動，直到指向最後一個成員

      d)每呼叫next方法返回一個包含value和done屬性的物件
    */
    [Symbol.iterator](){
        let index = 0;
        return {
            next: () => {
                if(index < meishi.status.length){
                    const result =  {value:this.status[index],done:false};
                    index++;
                    return result;
                }else{
                    return {value:undefined,done:true}
                }
            }
        }
    }
};
for(let v of meishi){
    console.log(v);
}



//可以用foreach遍歷得出結果 但不符合面向物件的思想  不能直接操作物件的屬性
/*meishi.status.forEach(item => {
        console.log(item);
    })*/