JavaScript教程day09-iterable

iterable

遍历Array可以采用下标循环，遍历Map和Set无法使用下标，为了统一集合类型，ES6标准引入了新的iterable类型，
Array，Map 和 Set都属于Iterale类型。
具有iterable类型的集合可以通过新for...of循环遍历

var a = ['A', 'B', 'C'];
var s = new Set(['A', 'B', 'C']);
var m = new Map([1, 'x'], [2, 'y'], [3, 'z']);
for (var x of a) {
    alert(x);
}
for (var x of s) {
    alert(x);
}
for (var x of m) {
    alert(x[0] + '=' + x[1]);
}

for...of 和 for...in区别
for...in循环由于历史遗留问题，他遍历的实际上是对象的属性名称，一个Array数组实际上也是一个对象它的每个索引被视为一个属性

当我们手动给Array对象添加了额外的属性后，for...in循环将带来意想不到的意外效果,
这就是为什么引入新的for...of

var a = ['A', 'B', 'C'];
a.name = 'Hello';
for (var x in a) {
    alert(x); // '0', '1', '2', 'name'
}

更好的方式是直接使用iterable内置的forEach方法，它接收一个函数，每次迭代就自动回调该函数。

var a = ['A', 'B', 'C'];
a.forEach(function(element, index, array) {
   // element: 指向当前元素的值
    //index: 指向当前索引
    // array: 指向Array对象本身
    alert(element);
});

Set与Array相似，但Set没有索引，因此回调函数的前两个参数就是元素本身：

var s = new Set(['A', 'B', 'C']);
s.forEach(function(element, index, array){
    alert(element);
});

Map的回调函数参数依次为value、key 和map本身：

var m = new Map([1, 'x'], [2, 'y'], [3, 'z']);
m.forEach(function(value, key, map){
    alert(value);
});

如果对某些参数不感兴趣，由于JavaScript的按户调用不要求参数必须一致，因此可以忽略它们，例如，只需要获得Array的element：

var a = ['A', 'B', 'C'];
a.forEach(function(element){
    alert(element);
});

笔记整理自廖雪峰JavaScript教程