ES6-Iterator

Iterator

Iterator并不是一组新的API,而是代表一种新的遍历数据的方式。
ES6规定,默认的Iterator接口部署在数据结构的Symbol.iterator属性,或者说,一个数据结构只要具有Symbol.iterator属性,就可以认为是“可遍历的”(iterable)
在ES6中,有三类数据结构原生具备Iterator接口:数组部分类数组对象,如String, SetMap结构。

调用Iterator接口的场景

  • 解构赋值,对数组和Set结构进行解构赋值时
let set = new Set().add('a').add('b').add('c');
let [x, y] = set; // 解构赋值,调用Iterator
  • 扩展运算符
var str = 'hello';
[...str];
  • yield*
function* gen(){
    yield 1;
    yield 2;
}
var g = gen();
g.next();
  • for...of
  • Array.from()
  • Object.keys()等
  • Map(), Set()
  • Promise.all()
  • Promise.race()

各种遍历数组的方法比较

  • for循环
    • 写法复杂
var arr = ['a', 'b', 'c'];
for(var i=0, len=arr.length; i < len; i++){
    console.log(arr[i]);
}
  • forEach
    • 无法通过break,return等方法终止遍历
var arr = ['a', 'b', 'c'];
arr.forEach(function(item, i, arr){
    console.log(item)
})
  • for...in
    • 遍历对象用,不适用于遍历对象
    • 数组的键名是数字,但是for...in循环是以字符串作为键名“0”、“1”、“2”等等。
    • for...in循环不仅遍历数字键名,还会遍历手动添加的其他键,甚至包括原型链上的键。
    • 某些情况下,for...in循环会以任意顺序遍历键名。
var arr = ['a', 'b', 'c'];
for(let i in arr){ // 拿到的是index,不是内容元素
    console.log(arr[i]);
}
  • for...of
var arr = ['a', 'b', 'c'];
for(let item of arr){
    if(item > 'a'){
        console.log(item);
        break;
    }
}
原文地址:https://www.cnblogs.com/ddfe/p/5609710.html