js遍历数组的五种方式

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

优化代码：

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

// 1 2 3 4 5 6

当数组的长度不回改变时，我们使用一个临时变量来存储数组的长度,以获得更好的效率（因为每次比较的时候都省去计算arr.length）。当数组较大时优化效果才会比较明显。

forEach

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]
})

数组自带的遍历方法，虽然使用频率略高，但是性能仍然比普通循环略低。
数组里的元素个数有几个，该方法里的回调就会执行几次。
可以使用for就尽量不要使用forEach。

map

var arr = [1, 2, 3, 4, 5, 6]
var newArr = arr.map(function (item, idnex) {
    return item * item
})

console.log(newArr)    // [1, 4, 9, 16, 25, 36]

遍历每一个元素并且返回对应的元素(可以返回处理后的元素) (map 映射 一一 对应)
返回的新数组和旧数组的长度是一样的
性能比forEach差

filter

var arr = [
	{ id: 1, name: '买笔', done: true },
	{ id: 2, name: '买笔记本', done: true },
	{ id: 3, name: '练字', done: false }
]
    
var newArr = arr.filter(function (item, index) {
	return item.done
})

console.log(newArr)

// [{ id: 1, name: '买笔', done: true },{ id: 2, name: '买笔记本', done: true }]

遍历数组，过滤出符合条件的元素并返回一个新数组

for-in

 let arr=[2,4,6,10];
    let index;
    for (index in arr){
        console.log(arr[index]);
    }    
    	 //arr[0]=2
    	 //arr[1]=4
    	 //arr[2]=6
    	 //arr[3]=10

let per={
        name:"zhang San",
        sex:'male',
        age:18
    };
    for(let key in per){
        console.log("per[" + key + "]=" + per[key]);
    }
          //per[name]=zhang San
		  //per[sex]=male
		  //per[age]=18

for-in不仅可以遍历数组还可以遍历对象。
for-in在遍历的时候，它不仅遍历了对象上的属性，而且还遍历了对象父类原型上的属性。所以for-in并不适合遍历Array中的元素，更适合遍历对象中的属性，这也是创造for-in的初衷。但是对于稀疏数组，使用它却是极好的。

let key;
let arr = [];
arr[0] = "a";
arr[999] = "b";
arr[99999] = "c";
for(key in arr) {
	if(arr.hasOwnProperty(key)  && /^0$|^[1-9]\d*$/.test(key) && key <= 100000) {
        console.log(arr[key]);
    }
}

除非明确要迭代一个属性数量未知的对象，否则应该避免使用for-in。