使用 Symbol.iterator 來瀏覽容器

前言

  在先前的 關於 Symbol.iterator 介紹了 iterator 的基本應用，這次來學習瀏覽，在此把學習的過程做個紀錄。

內容

  範例如下

const map1 = new Map();

map1.set('0', 'foo');
map1.set(1, 'bar');

const iterator1 = map1[Symbol.iterator]();

let ele = iterator1.next();

while( !ele.done ){
  console.log(ele.value);
  ele = iterator1.next();
}
// ["0", "foo"]
// [1, "bar"]

//follow will output nothing
for (const item of iterator1) {
  console.log(item);
}

//
for (const item of map1[Symbol.iterator]() ) {
  console.log(item);
}
// ["0", "foo"]
// [1, "bar"]

這次要使用瀏覽， iterator  有個 next() ，利用這個方法來推進 iterator  ，每次被 next() 推出來的物件裡都會包含 done 與 value ，done 是布林值，用來確認是否為最後一個，value 就是容器裡的內容，while 迴圈示範了如何瀏覽，接著範例用 for...of 來瀏覽會發現不會輸出任何東西，原因也很簡單，iterator 已經被瀏覽在最後了，所以 for...of  就不會輸出了，所以要注意 for...of  適從當下的 iterator 瀏覽在結尾，並非從頭!如果要確保從頭，就要透過 Symbol.iterator 重新取得 iterator 。

參考資料

[ developer.mozilla.org ] Symbol.iterator

[ developer.mozilla.org ] Map.prototype[@@iterator]()

相關文章與資料

關於 Symbol.iterator