filter() 又称为过滤器函数或筛选函数。filter() 把传入的函数依次作用于每个元素,然后根据返回值是 true 还是 false 决定保留还是丢弃该元素
一、 定义和用法
filter() 方法创建一个新的数组,新数组中的元素是通过检查指定数组中符合条件的所有元素
注意:filter() 不会对空数组进行检测
注意:filter() 不会改变原始数组
二、语法
array.filter(function(currentValue,index,arr),thisValue)
注意:返回值返回数组,包含了符合条件的所有元素。如果没有符合条件的元素则返回空数组
下面是几个示例
1、在一个 Array 中,删掉偶数保留奇数
// 正常写法
var arr = [1, 2, 4, 5, 6, 9, 10, 15]
var result = arr.filter(function (x){
return x % 2 !== 0
})
console.log(result) // [1,5,9,15]
// 简便写法
var arr = [1, 2, 4, 5, 6, 9, 10, 15]
var result = arr.filter(x => x % 2 !== 0)
console.log(result)
2、将 Array 中的空字符串删掉
// 正常写法
var arr = ['A', '', 'B', null, undefined, 'C', ' ']
var result = arr.filter(function (x) {
// trim() 方法用于删除字符串的头尾空白符,空白符包括:空格、制表符 tab、换行符等其他空白符等。
return x && x.trim(); // 注意:IE9以下的版本没有trim()方法
})
console.log(result) // ['A', 'B', 'C']
// 简便写法
var arr = ['A', '', 'B', null, undefined, 'C', ' ']
var result = arr.filter(x => x && x.trim())
console.log(result)
filter() 接收的回调函数,可以有多个参数。通常我们仅使用第一个参数,表示数组的某个元素。回调函数还可以接收另外两个参数,表示元素的位置和数组本身。
var arr = ['A', 'B', 'C']
var result = arr.filter(function (element, index, self) {
console.log(element) // 依次打印 'A', 'B', 'C'
console.log(index) // 依次打印 0, 1, 2
console.log(self) // self 就是变量 arr
return true
})
因此,利用 filter() 可以巧妙的去除数组的重复元素
var r= [],
var arr = ['apple', 'strawberry','pear', 'apple', 'orange', 'orange', 'strawberry']
r = arr.filter(function (element, index, self) {
return self.indexOf(element) === index
})
console.log(r.toString()) //apple,strawberry,pear,orange
去除重复元素依靠的是 indexOf 总是返回第一个元素的位置,后面的重复元素位置的索引与 indexOf 返回的位置不相等,因此被 filter 滤掉了。文章来源:https://www.toymoban.com/news/detail-762528.html
文章来源地址https://www.toymoban.com/news/detail-762528.html
到了这里,关于js 中数组的 filter() 函数的基本使用的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!