js数组遍历方法总结

1.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

说明:最简单的一种,也是使用频率最高的的一种

2:优化–for循环

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

说明: 使用临时变量，将长度缓存起来，避免重复获取数组长度，当数组较大时优化效果才会比较明显。

3:弱化–for循环

for(j = 0; arr[j]!=null; j++) {
   
   
}

说明: 这种方法其实严格上也属于for循环，只不过是没有使用length判断，而使用变量本身判断

实际上，这种方法的性能要远远小于普通for循环

4.forEach循环(ES5)

遍历数组中的每一项，没有返回值，对原数组没有影响，不支持IE
数组里的元素个数有几个，该方法里的回调就会执行几次
第一个参数是数组里的元素(当前项)，第二个参数为数组里元素的索引，第三个参数则是它自己(原始数组)

var arr = [1, 2, 3, 4, 5, 6]
arr.forEach(function (item, index, array) {
   
    console.log(item)     // 1 2 3 4 5 6
    console.log(array)    // [1, 2, 3, 4, 5, 6]
})

说明: 数组自带的foreach循环，使用频率较高，实际上性能比普通for循环弱

5:foreach变种

Array.prototype.forEach.call(arr,function(el){
   

})

说明:由于forEach是Array型自带的,对于一些非这种类型的，无法直接使用(如NodeList)，所以才有了这个变种，使用这个变种可以让类似的数组拥有foreach功能。

实际性能要比普通foreach弱

6.for…in…循环

var arr = ['我', '是', '谁', '我', '在', '哪']
for(var key in arr) {
   
    console.log(key)
}

// 0 1 2 3 4 5

for-in循环是为了遍历对象而设计的，事实上for-in也能用来遍历数组，但定义的索引i是字符串类型的。如果数组具有一个可枚举的方法，也会被for-in遍历到，例如：

//for-in遍历数组
for ( var  i  in  arrTmp){
   
     console.log(i+ ": " +arrTmp[i])