js常用的数组遍历

map()

• 返回一个新数组，数组中的元素为原始数组元素调用函数处理后的值
• 按照原始数组元素顺序依次处理元素
• 不会对空数组进行检测、不会改变原数组、但实际效率还比不上foreach
• 可以使用return，但是不能使用break和continue

   let arrUsed = [1, 2, 3, 4, 5];
   let arrNew = arrUsed.map((item, index) => {
     if (item === 3) {
       return "˚∆˚";
     }
     return  item
   });
   console.log(arrNew, arrUsed); //  [1, 2, "˚∆˚", 4, 5]  [1, 2, 3, 4, 5]

forEach()

• 对数组的每个元素执行一次提供的函数。
• 总是返回undefined。
• function(currentValue, index, arr)；currentValue当前元素；index当前元素索引值；arr当前元素所属的数组对象
• thisValue,包含二个参数时，只能使用普通函数: 第二个参数可选
• 不改变原数组，可以使用return，但是不能使用break和continue； 在forEach中return会失效，因为forEach内部封装的有callback

   var arrList = [1, 2, 3];
   arrList.forEach(function(curr, index, arr){
     console.log(curr, index, arr, this)
   }, [222])

filter()

• filter 遍历数组,筛选出所有符合条件的对象，并将这些对象输出为一个新的数组
• 不会对空数组进行检测、不会改变原数组
• 可以使用return，但是不能使用break和continue

   let arrUsed = [1,2,3,4,5]
   let arrNew = arrUsed.filter((item, index) =>{
     return item > 3
   })
   console.log(arrNew, arrUsed) //  [4, 5] [1, 2, 3, 4, 5]

find()

• 返回通过测试（函数内判断）的数组的第一个元素的值,没有符合条件的元素返回undefined
• 不会对空数组进行检测、不会改变原数组
• 可以使用return，但是不能使用break和continue

   var ages = [3, 10, 18, 20];
   function checkAdult(age) {
       return age >= 18;
   }
   console.log(ages.find(checkAdult)) // 18

findIndex()

• 返回数组中第一个符合条件的元素的下标，如果所有成员都不符合就返回-1
• 不会对空数组进行检测、不会改变原数组
• 可以使用return，但是不能使用break和continue

   let arrNum = [1,2,3,4,5];
   let num = arrNum.findIndex(item => item > 3);
   console.log(num, arrNum[num]) // 3 4

some()

• 依次执行数组的每个元素，满足条件终止循环，返回true，如果没有满足判断条件的项，会遍历整个数组，并且最后返回false
• 不会对空数组进行检测、不会改变原数组
• 可以使用return，但是不能使用break和continue

   let arrUsed = [1,2,3,4,5]
   let arrNew = arrUsed.some((item, index) =>{
     return item > 3
   })
   console.log(arrNew, arrUsed) // true  [1, 2, 3, 4, 5]

every()

• 返回一个布尔值
• 检验数组中的每个元素是否符合要求，只要都符合返回true，遇到不符合就返回false，并终止遍历
• 可以使用return，但是不能使用break和continue

   let  arrEvery = [1,3,4,5,3,2,4]
   let temp = arrEvery.every((value) => {
     if(value % 1 === 0) {
       return true
     }
   })
   console.log(temp) // true

reduce

• 接收一个函数作为累加器（accumulator），数组中的每个值（从左到右）开始缩减，最终为一个值。
• 第二个参数作为第一次调用的a的值
• 可以使用return，但是不能使用break和continue

// reducer
let reduceArr = [0,1,2,3,4]
let reduceResult = reduceArr.reduce((a, b)=>{
  return a + b;
});
console.log(reduceResult);
// 结果: 10

reduceRight

• 和reduce一样是累加器，不过是从右往左计算
• 第二个参数作为第一次调用的a的值
• 可以使用return，但是不能使用break和continue、

let reduceRightArr = [0,1,2,3,4]
let reduceRightResult = reduceRightArr.reduceRight((a, b)=>{
  return a + b;
});
console.log(reduceRightResult);
// 结果: 10

for…

• 使用临时变量，并且遍历的是key.
• 可以正常使用使用break和continue, 但是不能正常使用return

let testArr = ['子项0','子项1','子项2'];
// break  
for(var i = 0; i < testArr.length; i++) {
  if(i === 1) {
    break;
  }
  console.log(testArr[i]);
}
// 结果为： 子项0

// continue
for(var i = 0; i < testArr.length; i++) {
  if(i === 1) {
    continue;
  }
  console.log(testArr[i]);
}
// 结果为: 子项0 子项目2

//return
for(var i = 0; i < testArr.length; i++) {
  if(i === 1) {
    return;
  }
  console.log(testArr[i]);
}
// 结果为什么也没有

for…of…

• 遍历的是value
• 这是最简洁、最直接的遍历数组元素的语法
• 这个方法避开了for-in循环的所有缺陷
• 性能要好于forin，但仍然比不上普通for循环

var arr = [1, 2, 3]
for(var item of arr) { // item代表数组里面的元素
    console.log(item); // 1, 2, 3
};

• 可以正常使用使用break和continue, 但是不能正常使用return

let testArr = ['子项0','子项1','子项2'];
// break  
for(let value of testArr){
  if(value === '子项1'){
    break;
  }
  console.log(value);
}
// 结果为： 子项0

// continue
for(let value of testArr){
  if(value === '子项1'){
    continue;
  }
  console.log(value);
}
// 结果为: 子项0 子项目2

//return
for(let value of testArr){
  if(value === '子项1'){
    return;
  }
  console.log(value);
}
// 结果为什么也没有

for…in…

• for…in更多是用来遍历对象，很少用来遍历数组， 不过 item 对应与数组的 key值，建议不要用该方法来遍历数组，因为它的效率是最低的。
• 遍历的是key
• 可以正常使用使用break和continue, 但是不能正常使用return

let testArr = ['子项0','子项1','子项2'];
// break  
for(let i in testArr){
  if(i === 1) {
    break;
  }
  console.log(testArr[i]);
}
// 结果为： 子项0

// continue
for(let i in testArr){
  if(i === 1) {
    continue;
  }
  console.log(testArr[i]);
}
// 结果为: 子项0 子项目2

//return
for(let i in testArr){
  if(i === 1) {
    return;
  }
  console.log(testArr[i]);
}
// 结果为什么也没有

其他

• 数组方法都不可以用break和continue，for循环之类的不可以用return但是可以正常使用break和continue
• break：是立即结束语句，并跳出语句，进行下个语句执行。
• continue：是停止当前语句，并从头执行该语句。continue语句只能用在while语句、do/while语句、for语句、或者for/in语句的循环体内，在其它地方使用都会引起错误！
• return：停止函数；return false 只在当前函数有效，不会影响其他外部函数的执行。在函数体中forEach不可以使用return
• 使用的语句环境不一样，break和continue是用在循环或switch语句中，return是用在函数语句中。