javascript 四种数组遍历方法

数组遍历方法

收集一些各种遍历的方法，主要针对数组

最传统方法：for( ; ; ){}

var arr=[1,2,3,4,5,6];
for(var i=0;i<arr.length;i++){
console.log(arr[i]);
}
//输出
1
2
3
4
5
6

for in 方法　

var arr=[1,2,3,4,5,6];
for(var i in arr){
console.log(arr[i]);
}
//输出
1
2
3
4
5
6

forEach 方法　　　Array.forEach(callback)

注意:forEach()方法是ES5.1标准引入的。

var arr=[1,2,3,4,5,6];
arr.forEach(function(v,i){//v==value　为arr项，i==index　为arr索引
console.log(i+'  'v );
})
//输出
0  1
1  2
2  3
3  4
4  5
5  6

在最新的ES6标准中新增了一个新方法　==for of==

for of 方法　　　

遍历Array可以采用下标循环，遍历Map和Set就无法使用下标。Map,set–无下标，无法使用索引进行遍历

为了统一集合类型，ES6标准引入了新的iterable类型，

Array、Map和Set都属于iterable类型。

==具有iterable类型的集合可以通过新的for … of循环来遍历。==

var arr=[1,2,3,4,5,6];
for(var value of Arr){
console.log(value);
}
//输出
1
2
3
4
5
6

for … of循环和for … in循环有何区别

for … in循环，它遍历的实际上是对象的属性名称。

一个Array数组实际上也是一个对象，它的每个元素的索引被视为一个属性。

当我们手动给Array对象添加了额外的属性后，for … in循环将带来意想不到的意外效果：

for in 遍历数组时会为把数组索引作为键值　如：数组0、1、2、3、4、5、…的键；当我们这样写：

var arr=[1,2,3,4,5,6];
arr.value='val';
//在使用for in 遍历时
for(var i in arr){
console.log(i+'   '+arr[i]);//这时的i为键值，不为数组索引
}
//输出
0   1
1   2
2   3
3   4
4   5
5   6
value   val

接着执行，这时出现问题：

arr;//输出[1, 2, 3, 4, 5, 6]

//使用 console.log(arr)时，这样
console.log(arr);//输出[1, 2, 3, 4, 5, 6, value: "val"]

//alert(arr)时
alert(arr);//输出[1, 2, 3, 4, 5, 6]

而当我们使用for of 时：

var arr=[1,2,3,4,5,6];
arr.value='val';
//在使用for in 遍历时
for(var v of arr){
console.log(v);//v为数组的项
}
//输出
1
2
3
4
5
6

直接遍历出值，杜绝使用for in 时，下标索引的影响