数组的迭代方法

最新推荐文章于 2024-02-27 16:06:44 发布

Yan_Gold

最新推荐文章于 2024-02-27 16:06:44 发布

阅读量94

点赞数

文章标签： javascript java html

本文链接：https://blog.csdn.net/Yan_Gold/article/details/127032692

版权

every

<body>
    <!-- every应用场景：用于判断数组中是否所有元素都满足条件
         every函数返回一个布尔类型值 -->
         <script>
            //判断数组中有没有负数
            let arr = [32,5,454,-63,424,35]
            let arr1 = arr.every((item)=>{return item > 0;})
            console.log(arr1);//false
         </script>
</body>

filter

<body>
    <!-- filter应用场景：用于筛选数组中满足条件的元素，返回筛选后的新数组
         语法：数组.filter（function（value,index,arr）{return 筛选条件}
        注意： 1，回调函数执行次数 == 数组长度
               2，filter函数返回的新数组长度 ！= 原数组长度-->
         <script>
            let arr = [22,435,523,51,5,-345]
            //需求：求数组中大于10 的所有元素
            // 之前的方法
            // let result = []
            // for (let i = 0;i < arr.length; i++){ if(arr[i]>10){result.push(arr[i])}}
            // console.log(result);
            // let nArr = arr.filter(function(value){return value > 10}) 
            // console.log(nArr);
            let wArr = arr.filter((value)=>{
                return value%2 == 0 
            })//wArr里保存的是所有满足条件的元素
            console.log(wArr);//[22]
         </script>
</body>

findIndex

<body>
    <!-- 数组findIndex方法
        作用：获取符合条件的第一个元素位置（下标）
        语法：arr.findIndex((item,index)=>{return true/false}) 
        返回值：符合则返回元素下标，不符合则返回-1
        应用场景：适合数组中元素为对象·类型，比传统佛如循环要高效-->
    <script>
        let arr = [
            {name:'王德发',age:'23'},
            {name:'刘鑫',age:'22'},
            {name:'张祥俊',age:'19'},
            {name:'张毅凡',age:'21'},
        ]
        //数组findIndex方法：获取符合条件的第一个元素位置（下标）

        //需求：查找arr中小于20的在什么位置
        let res = arr.findIndex((item,index)=>{
            return item.age < 20;
        }) 
        console.log(res);//2
    </script>
</body>

forEach

<body>
    <!-- 1.forEach应用场景：用于遍历数组，相当于for循环另一种写法
         2.语法：数组.forEach(function(value,index,arr){//算法})
         3.forEach必须提供一个参数
         a.value：每次遍历到的数组元素
         b.index：每次遍历到的数组的下标 -->
    <script>
        let arr = [32,5,6,6454,25,3]
        //  需求：对数组进行累加

        // 原来的写法
        // let sum = 0;
        // for(let i = 0;i < arr.length;i++){sum +=arr[i]}console.log(sum);
        let sum = 0
        arr.forEach((value)=>{sum += value})
        console.log(sum);//6525
    </script>
    <!-- 注意点：
        1.回调函数执行次数 == 数组长度（数组中有多少元素，回调函数就会执行几次）
        2.forEach函数没有返回值
        3.回调函数不需要return（就算手动return，页不会结束循环）
    filter方法和forEach方法的参数完全相同
     filter主要是根据条件进行筛选，满足条件的值会被return返回，需要一个变量接收 -->
</body>

map

<body>
    <!-- map应用场景：利用某种规则映射得到一个新数组
         即：遍历每一个以元素，并对每一个元素做响应的处理，返回一个新数组
          例如：将数组中每一个元素+1
          例如将数组中每一个元素*2 -->
          <!-- 注意
            1回调函数执行次数 == 数组长度（数组中有几个元素回调函数就会执行几次）
            2map函数返回的新数组长度 == 原数组长度
            3回调函数中一定要return，返回的是当前遍历的元素值，
            如果不return，新数组中的每一个元素都变成了undefined -->
            <!-- 语法：（元素，下标）=> {return 新元素} -->
   <script>
    let wdf = [21,34,525,645,-35,52]
    //数组中每个元素 *2
    let wdf1 = wdf.map((value) => {
       return value * 2;
    })
    console.log(wdf1);
   </script> 
</body>

reduce

<body>
    <!-- 数组reduce方法 
          1.作用：遍历数组元素，为每个数组执行一次回调函数
          2.语法：arr.reduce((sum,value) => {return sum + value})
          返回值：最终sum值
          3.应用场景：数组求和/平均数/最大值/最小值
          4.注意点：最好给一个初始值，避免空数组报错-->
    <script>
      let emm = [32,45,1,4,5,-29];
      //emm：初始值，默认为数组第一个元素
      // value：数组的每一个元素，默认为数组的第二个元素。
      let res = emm.reduce((sum,value) => {
        // 这里必须要return，相当于把奔驰计算的结果赋值给下一次的sum：sum=sum + value
        return sum + value;
      },0)
      console.log(res);//58
      // 下面这种写法与上面等价，Es6箭头函数如果只有一行代码则可以省略大括号，且省略return
      console.log(emm.reduce((sum,value)=> sum + value));//58
    </script>
</body>

some

<body>
    <!-- some应用场景：用于判断数组中是否存在满足条件的元素
        注意：1.回调函数执行次数 ！= 数组长度
              2.some函数返回一个布尔类型值
              3.回调函数返回布尔类型值用于结束遍历 
                   return true；遍历结束，且送么函数返回值为true
                   return false；遍历继续，且some函数返回值为true-->
       <script>
        //需求：判断数组中有没有负数
        let arr = [23,435,-78,56,85]
        let arr1 = arr.some((item,index)=>{return item < 0});
        console.log(arr1);//false
       </script>
</body>