本文详解JavaScript中Array、Map和Set三种集合类型的遍历方式。重点对比for...in与for...of的区别，说明为何推荐使用for...of遍历iterable类型，并演示内置forEach方法的参数差异及实际应用场景。
Array、Map与Set的遍历基础
Array类型支持通过下标访问，而Map和Set类型不支持下标访问。随着ES6标准的引入，iterable（可迭代）类型被定义，Array、Map和Set均属于该类型，因此它们都可以使用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) { // 遍历Array
alert(x);
}
for (var x of s) { // 遍历Set
alert(x);
}
for (var x of m) { // 遍历Map
alert(x[0] + '=' + x[1]);
}需要区分for...of与for...in的使用场景。由于历史原因，for...in循环遍历的是对象的属性名。尽管Array数组在底层也是对象，其元素索引被视为属性，但这导致遍历行为与预期可能存在偏差。
如果在Array对象上手动添加额外属性，使用for...in循环会遍历到这些非索引属性，从而产生非预期的结果。
for...in与for...of的遍历差异
var a = ['A', 'B', 'C'];
a.name = 'Hello';
for (var x in a) {
alert(x); // '0', '1', '2', 'name'
}
var a = ['A', 'B', 'C'];
a.name = 'Hello';
for (var x of a) {
alert(x); // 'A', 'B', 'C'
}
针对上述问题，更推荐的方式是利用iterable类型内置的forEach方法进行处理：
使用内置forEach方法遍历
var a = ['A', 'B', 'C'];
a.forEach(function (element, index, array) {
// element: 指向当前元素的值
// index: 指向当前索引
// array: 指向Array对象本身
alert(element);//'A','B','C'
});
var s = new Set(['A', 'B', 'C']);
s.forEach(function (element, sameElement, set) {
alert("参数1="+element+",参数2="+sameElement);
});
//参数1=A,参数2=A
//参数1=B,参数2=B
//参数1=C,参数2=C
var m = new Map([[1, 'x'], [2, 'y'], [3, 'z']]);
m.forEach(function (value, key, map) {
alert("参数1="+value+",参数2="+key);
});
//参数1=x,参数2=1
//参数1=y,参数2=2
//参数1=z,参数2=3
以上内容涵盖了JavaScript中遍历Array、Map和Set的核心知识点，旨在提供清晰的参考。