1. 程式人生 > 其它 >es6學習——迭代器介面

es6學習——迭代器介面

為什麼需要迭代器介面 1 對於一般的迭代迴圈 使用了 for(i=0;i<...)這中單一結構,只能通過陣列進行遍歷,且每次遍歷都要獲取陣列值,再通過index取值,不適合所有陣列型別; 2 迭代的順序是固定的 對於具有隱式順序的結構 比如map set等 是不適用的。 迭代器就是用於更好的對物件進行迭代的。 哪些資料型別內建了迭代器介面 (即不用通過迭代器工廠函式就能夠自動實現的) // 哪些內建了迭代器介面
let test=1; // false
test={1:22}; // false
test=function(){}; // false
test=new Set(); // true
test=new Map(); // true
test=[]; // true
test="1222"; // true
console.log(typeof test[Symbol.iterator] === "function")
每個迭代器都表示對可迭代物件的一次性有序遍歷 es6 具有三種集合物件型別:陣列、map、set ,三種類型都擁有如下迭代器   a、entries()返回一個包含鍵值對的迭代器   b、values() 返回一個包含集合中的值的迭代器   c、keys() 返回一個包含集合中的鍵的迭代器,對於set來說鍵和值是相同的,對於map來說,迭代器返回每個不重複的鍵 這些迭代器的返回結果
// let map=new Map();// 先驗證map
let map=new WeakMap();// 驗證weakMap
let a=1;
map.set(a,'11');
map.set(2,'22');
map.set(3,'33');
map.set(4,'44');
 
let entries=map.entries();
// console.log(entries) // 返回一個包含鍵值對的迭代器[Map Entries] { [ 1, '11' ], [ 2, '22' ], [ 3, '33' ], [ 4, '44' ] }
let values=map.values();
// console.log(values) // 返回鍵值的迭代器[Map Iterator] { '11', '22', '33', '44' }
let key=map.keys();
console.log(key) // 返回鍵名的迭代器[Map Iterator] { 1, 2, 3, 4 }

  

可以接收上述所說的迭代器可迭代物件的原生語言特性有: a、 for-of 迴圈 b、 陣列解構 c、 擴充套件操作符 d、 Array.from() e、 建立集合 f、 建立對映 g、 Promise.all() 接收由期約組成的可迭代物件 h、 Promise.race() 接收由期約組成的可迭代物件 i、 yield* 操作符,在生成器中使用 所以一般可以通過for..of對上述的迭代器進行更好的遍歷 進行特性操作 引申for..in for...of 和forEach區別
1 for...in(可以適用於物件和陣列) 會遍歷陣列所有的可列舉屬性 包括原型 Array.prototype.name="zou"; let arr = [1, 2, 3]; for (const item in arr) { console.log(item); // 0 1 2 name } let obj={1:11,2:22,3:33}; for (let item in obj) { console.log(item); // 1 2 3 獲取鍵名 不足: 1 返回的型別不一定按照真實的陣列的index 2 使用for in會遍歷陣列活物件所有的可列舉屬性,包括原型。例如上慄的原型方法method和name屬性 不想的話 可以用hasOwnProperty

2 for...of 迴圈

只能用來 遍歷數/陣列物件/字串/map/set等擁有迭代器物件的集合 以及arr/map/set的values()/entries()/ keys() 他們也是具有迭代器介面的集合 以及他們的 與forEach()不同的是,它可以正確響應break、continue和return語句 牛逼!!!for in也可以 forEach forEach 迴圈遍歷陣列不能通過break退出;