js中filter过滤用法总结

JavaScript013

js中filter过滤用法总结,第1张

filter() 方法创建一个新的数组,新数组中的元素是通过检查指定数组中符合条件的所有元素。

注意: filter() 不会对空数组进行检测。

注意: filter() 不会改变原始数组。

| 参数 | 描述 |

| function(currentValue, index,arr) | 必须。函数,数组中的每个元素都会执行这个函数

函数参数:

| 参数 | 描述 |

| currentValue | 必须。当前元素的值 |

| index | 可选。当期元素的索引值 |

| arr | 可选。当期元素属于的数组对象 |

|

| thisValue | 可选。对象作为该执行回调时使用,传递给函数,用作 "this" 的值。

如果省略了 thisValue ,"this" 的值为 "undefined" |

首先回顾一下filter的作用:过滤数组中符合条件的元素

另外也可以用来过滤对象数组中符合条件的对象,eg:

|

目前比较常用的方法是使用ES6的set完成,eg:

结合map使用可以先过滤出符合条件的对象然后去除某些不需要的字段,比如:

简单讲filter就是一个数组过滤器,参数接收一个函数,数组的每一项经过函数过滤,返回一个符合过滤条件的新数组

函数接收三个参数:

filter 是根据返回的值是否为真来判断是否保留元素,所以可以这样实现

Array.prototype.filter = Array.prototype.filter || function(func) {

    var arr = this

    var r = []

    for (var i = 0 i < arr.length i++) {

        if (func(arr[i])) {

            r.push(arr[i])

        }

    }

    return r

}

因为目前大部分浏览器有 filter 实现,所以测试时只能改个名字叫 filterx,下面是测试代码

var data = [1,2,3,4,5,6,7]

Array.prototype.filterx = Array.prototype.filterx || function(func) {

    var arr = this

    var r = []

    for (var i = 0 i < arr.length i++) {

        if (func(arr[i])) {

            r.push(arr[i])

        }

    }

    return r

}

console.log(data.filter(function(t) {

    return t % 3 > 0

}))

console.log(data.filterx(function(t) {

    return t % 3 > 0

}))

1、filter() 方法创建一个新的数组,新数组中的元素是通过检查指定数组中符合条件的所有元素。原数组不变不会对空数组进行检测 2、find() 对于空数组,函数是不会执行的。不会改变原数组返回符合测试条件的第一个数组元素值3、some 用于检测数组中的元素是否满足指定条件会依次执行数组的每个元素-如果有一个元素满足条件(即只要有条件满足即可相当于或),则表达式返回true , 剩余的元素不会再执行检测----------------------如果没有满足条件的元素,则返回false4、every() 方法用于检测数组所有元素是否都符合指定条件(通过函数提供)every() 方法使用指定函数检测数组中的所有元素-如果数组中检测到有一个元素不满足,则整个表达式返回 false ,且剩余的元素不会再进行检测------------------------------------------如果所有元素都满足条件,则返回 true