数组遍历方法详解

1，for，for in 和 for of方法遍历数组

最基础的遍历，for循环中可以进行一些操作， 遇到return就会跳出for循环后面的代码将不会执行,在函数中也如此，遇见return直接结束函数的调用

for方法可以有返回值，但是无法用变量直接接受返回值，

只有在函数中才可以拿到for循环的return出的返回值 

 for of 和 for in的用法和for几乎相同,想要得到返回值就必须在函数中return，当作函数的返回值返回，不过for in既可以遍历数组也可以遍历对象，遍历数组时k为索引，遍历对象时，k为属性名。for of只能遍历数组,因为对象没有可遍历的接口，得到的k为数组的值

2，forEach()遍历

forEach没有返回值，在函数中return也得不到返回值，所有想要在遍历中返回某一项时不能使用forEach。但是forEach中遇到return让如果不是在代码块的最外层，就会跳出当前的代码块,后面的代码将继续执行

let arr = [1, 2, { name: 'zs', age: '18' }]
//测试有无返回值
const res = arr.forEach((item) => {
  if (item.name == 'zs') return item
})
console.log(res) //undefined
//在函数中测试
function fn(arr) {
  arr.forEach((item) => {
          if (item.name == 'zs') return item
      })
  }
console.log(fn(arr)) //undefined

forEach遍历时，是把要遍历数组进行一次浅拷贝，然后进行遍历，这样修改原数组上的简单数据类型的值时，不会被修改，但是修改复杂数据类型时，也会对原数组上面的进行修改

let arr = [1, 2, { name: 'zs', age: '18' }]
//修改复杂数据类型,原数组改变
const res = arr.forEach((item) => {
  if (item.name == 'zs') item.name = 'ls'
})
console.log(arr[2].name) //ls
//修改简单数据类型,原数组不变
const res1 = arr.forEach((item) => {
  if (item == 2) item = 100
})
console.log(arr[1]) //2

3，map()方法遍历,会返回一个新的数组

map() 方法创建一个新数组，其结果是该数组中的每个元素都调用一个提供的函数后返回的结果。map遍历时和forEach一样，是把要遍历数组进行一次浅拷贝。而且map有返回值，可以理解为过滤器，但是每一项都会过滤，没有被返回的项目会返回undefined

let arr = [1, 2, 3,4]
const res = arr.map((item) => {
  if(item==1||item==2){
        return item*100
    }
})
//返回一个数组，没经过处理的item将会以undefined的形式保存在返回的数组中
console.log(res) //100 200 undefined undefined

//如果后俩项想保持不变，只有前两项*100
const res = arr.map((item) => {
  if(item==1||item==2){
        return item*100  //这里的return不会结束整个循环，只是会跳出当前的代码块
    }else{
        return item
    }
})

4，some()

一真及真，some返回布尔值，如果有一项满足条件则返回true。同样进行浅拷贝然后才遍历的

let arr = [1, 2, 3, 4]
const res = arr.some((item) => {
    return item > 3
})
console.log(res) //true

5，every()

every返回布尔值，如果所有数组项都满足条件则返回true。同样先进行浅拷贝然后才遍历。

let arr = [1, 2, 3, 4]
const res = arr.every((item) => {
   return item > 0
})
console.log(res) //true

6，filter()

filter可以过滤数组，包含满足条件的数组项，返回一个新数组。同样先对原数组进行浅拷贝，然后再遍历

let arr = [1, 2, 3, 4];
let res = arr.filter((item, index, arr) => {
    return item <= 2;
})
console.log(res) // [1, 2]

7,find()和findIndex()

ES5中可以通过indexOf()和lastIndexOf()查找与特定值匹配的元素，
而ES6中的find()和findIndex()可以根据某个条件去查找匹配的元素。
find()返回查找的值，findIndex()返回查找的值的索引，两者都只返回第一个满足条件的值