数组的常用方法之filter

最新推荐文章于 2023-04-23 10:19:17 发布

ADwblj

最新推荐文章于 2023-04-23 10:19:17 发布

阅读量152

点赞数

文章标签：算法 javascript

本文链接：https://blog.csdn.net/ADwblj/article/details/128070282

版权

filter与上次介绍的map同为遍历数组的方法，也给有自身的特点

filter应用场景为：根据条件筛选数组将满足条件的元素放入新的数组中

功能：筛选数组和批量删除数组元素

1. 循环次数等于数组的长度

2. 方法自身的返回值为新的数组

3. 再回调函数内部满足条件的放入新的数组不满足条件的不放入新数组

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>

<body>
  <script>
    let arr = [
      { name: '商品1', select: false },
      { name: '商品2', select: true },
      { name: '商品3', select: false },
      { name: '商品4', select: false },
      { name: '商品5', select: true },
    ]


    // 需求： 筛选用户选中的商品
    // const res = arr.filter( (item,index)=>{
    //   if( item.select ){
    //     return true
    //   }else{
    //     return false
    //   }
    // } )
    // console.log( res )

    const res = arr.filter(item => item.select)
    console.log(res)//商品2， 商品5

    // 需求 : 删除选中的商品(把true的剔除，保留false的商品)
    // 等价于： 筛选用户没有选中的商品
    arr = arr.filter(item => !item.select)
    console.log(arr)//商品1 商品3 商品4

  </script>
</body>

</html>