JavaScript的遍历数组forEach,map,filter,reduce,find

1.forEach

forEach：能迭代整个数组，没有返回值，和for循环的功能类似。

 // forEach 就是遍历  加强版的for循环  适合于遍历数组对象
    const arr = ['red', 'green', 'pink']
    const result = arr.forEach(function (item, index) {
      console.log(item)  // 数组元素 red  green pink
      console.log(index) // 索引号
    })
    // console.log(result)

 2.filter

filter方法：类似于数据库中的select查询语句，将满足条件的元素组成一个新数组返回。

let num = [1, 2, 3, 4, 5, 4, 3, 2, 1];
let res = num.filter((item, index, array) => item > 2);  //ES6新语法
console.log(res); // 3,4,5,4,3

const arr = [10, 20, 30]
     const newArr = arr.filter(function (item, index) {
        console.log(item)
        console.log(index)
      return item >= 20
     })
    // 返回的符合条件的新数组

    const newArr = arr.filter(item => item >= 20)
    console.log(newArr)

3.map

map方法：处理数组中的每个元素，然后将其返回值组成一个新的数组

const arr = ['red', 'blue', 'green']
    // map 方法也是遍历  处理数据  可以返回一个数组
    const newArr = arr.map(function (item, i) {
       console.log(item)  // 数组元素  'red'
       console.log(i)  // 下标
      return item + '老师'
    })
    console.log(newArr)


    ['red老师', 'blue老师', 'green老师']


    const arr1 = [10, 20, 30]
    const newArr1 = arr1.map(function (item) {
      return item + 10
    })
    console.log(newArr1)

4.reduce

reduce 返回函数累计处理的结果，经常用于求和等

累计值参数： 1. 如果有起始值，则以起始值为准开始累计，累计值 = 起始值 2. 如果没有起始值，则累计值以数组的第一个数组元素作为起始值开始累计 3. 后面每次遍历就会用后面的数组元素累计到累计值里面（类似求和里面的sum ）

 arr.reduce(function (prev, item) {
//有初值
       // console.log(11)
       // console.log(prev)
       return prev + item
     }, 0)

//无初值
     arr.reduce(function (prev, item) {
       console.log(11)
       // console.log(prev)
       return prev + item
     })

5.find

查找元素，返回符合条件的第一个元素/对象，没有则返回false

//找数组元素 
const arr = ['red', 'blue', 'green']
     const re = arr.find(function (item) {
       return item === 'blue'
     })
     console.log(re)

    const arr = [
      {
        name: '小米',
        price: 1999
      },
      {
        name: '华为',
        price: 3999
      },
    ]
     //找 小米 这个对象，并且返回这个对象
     const mi = arr.find(function (item) {
       // console.log(item)  //
       // console.log(item.name)  //
       console.log(111)
       return item.name === '华为'
     })
    // 1. find 查找
     const mi = arr.find(item => item.name === '小米')
     console.log(mi)