遍历数组操作

在一步一步的学习中我们会发现在处理数据时所用到的方法随之增多
下面我真理一些数组操作：

数组操作

1、forEach
2、map
3、filter
4、reduce
5、every、some

传统的for循环与for...in、for...on在这里就不多做介绍了，有需要了解的可以自行百度

• forEach
  -被传递给foreach的函数会在数组的每个元素上执行一次，元素作为参数传递给该函数

     /* 
      forEach可以用来替代for循环
      forEach不存在返回值
    */
    const arr = [1,2,3,4,5]
    /* 
      for (let i = 0;i < arr.length; i++){
      console.log(arr[i])
    } */

    console.log(arr.forEach((value, index, arr) => {
    console.log(value, index, arr)

• map

/*
    arr.map((value, index, arr) => {
      return 返回值
    })
    返回值会变成一个新的数据作为arr.map的返回值
    map操作的返回值为一个数组
    
    map用来对已知数据进行数据筛选，得到一个新的类型的数组
*/
    /* const arr = [1, 2, 3, 4, 5, 6]
    console.log(arr.map((value, index, arr) => {
      // console.log(value, index, arr)
      return value + 10
    })) */
    const students = [
      {
        name: '张三',
        age: 18
      }, {
        name: '李四',
        age: 12
      }, {
        name: '王五',
        age: 14
      }, {
        name: '赵六',
        age: 16
      }
    // ["张三", '李四', '王五', '赵六']
      
    /* const newarr = []
    for(let i = 0; i < students.length; i++){
      newarr.push(students[i].name)
    } */

    // const newarr = students.map(student => student.name)
    const newarr = students.map(student => student.age)
    console.log(newarr)

• filter

 /* 
      filter的作用是过滤
      将数组中符合条件的数据过滤出来形成一个新的数组

      arr.filter(() => {
        // 只要返回值为true，那么对应的遍历到的内容就会被添加到新的数组中

      })  
      arr.filter 最后返回的结果也是数组
      filter最终的结果还是原本的数组结构，只不过，数组中的值少了    */
    /* const arr = [1,2,3,4,5]
      
    const newarr = arr.filter(num => true)
    console.log(newarr) */
    const students = [
      {
        name: '张三',
        age: 18,
        sex: '男'
      }, {
        name: '李四',
        age: 12,
        sex: '女'        
      }, {
        name: '王五',
        age: 14,
        sex: '男'        
      }, {
        name: '赵六',
        age: 16,
        sex: '女'        
      }
    ]
    /* var arr = []
    for(var i = 0; i< students.length;i++){
      if(students[i].sex === "女"){
        arr.push(students[i])
      }
    } */

    // const arr = students.filter(student => student.sex === "女")
   /*  const arr = students.filter(function(student){
      return student.sex === "女"
    })
    console.log(arr) */

    const arr = students.filter(student => student.age >= 14)
    console.log(arr)//输出结果就是age>=14 学生信息

• reduce
  every() 当数组中的每一个元素在callback上被返回true时就返回true(注意：要求每一个单元项都返回true时才为true)

/* 
      用于数组中内容的计算
     */
    const arr = [1,2,3,4,5]
    
    /* 
      reduce的回调函数中有四个
      num 
        在第一次遍历是reduce的第二个参数   
        之后的遍历是上一次执行回调时的返回值 
      value 遍历数组对应的数据
      index 下标
      arr 调用reduce方法的数组
     */
    /* const sum = arr.reduce((num, value, index, arr) => {
      console.log(num, value, index, arr)
      return 1
    }, 2) */

    /* const sum = arr.reduceRight((num, value) => {
      console.log(num, value)
      return num + value
    }, 0) */

    // const 

    // console.log(sum)
    const students = [
      {
        name: '张三',
        age: 18,
        sex: '男',
        score: 100
      }, {
        name: '李四',
        age: 12,
        sex: '女',
        score: 98          
      }, {
        name: '王五',
        age: 14,
        sex: '男',
        score: 67              
      }, {
        name: '赵六',
        age: 16,
        sex: '女',
        score: 89              
      }
    ]

    const sum = students.reduce((sumscore, student) => sumscore + student.score, 0)
    console.log(sum)

• every、some
  every()与some()的区别是：前者要求所有元素都符合条件才返回true,后者要求只要有符合条件的就返回true

  /*
    some表示数组中只要有一个符合对应条件则返回true

    every表示数组中全局符合条件才返回true

    some和every调用后得到的都是布尔值
  */
 
    const arr = [1, 2, 3, 4, 5]
    // 判断数组中是否含有大于2的数字
    console.log(arr.some(num => num > 2))

    // 判断数组中的数字是否全部大于2
    console.log(arr.every(num => num > 2))

有兴趣的朋友可以浏览一下渣渣熊的博客