JS数组遍历 追求理想最优解

对比10种遍历方式 ，精选以下三种遍历以应对大部分情况

姐妹篇 —— JS对象遍历 追求理想最优解

1. forEach 推荐

const arr = [1,2,3]
arr.forEach((item,index,arr)=> {
  console.log(item,index,arr)   // 1,0,[1, 2, 3]
})
无法跳出循环

2. for 最快

const arr = [1, 2, 3, , 5]

for (let i = 0, len = arr.length; i < len; i++) {
  if (arr[i] === 3) {
    break         // 1 2
    continue      // 1 2 3 undefined 5
  }
  console.log(arr[i])
}

break 跳出循环
continue 跳过本次

3. map

const arr = [1,2,3]
const newArr = arr.map(item => {
  return item + 1
})
console.log(newArr)    // [2, 3, 4]
无法跳出循环
返回值组成一个新数组，长度与原数组一致

效率对比

遍历方式	耗时
forEach	1000ms
for	63ms
map	1200ms

总结

1. forEach 可阅读性高，性能均衡，推荐
2. for 性能最好，擅长处理数据量较大，并且可以 跳出循环 和 跳出本次
3. map 便于重新生成新数组

姐妹篇 —— JS对象遍历 追求理想最优解