filter
filter()
方法创建一个新数组, 其包含通过所提供函数实现的测试的所有元素。
语法
var newArray = arr.filter(callback(element,index,array),thisArg)
-
callback
用来测试数组的每个元素的函数。返回
true
表示该元素通过测试,保留该元素,false
则不保留。它接受以下三个参数:-
element
数组中当前正在处理的元素。
-
index
可选正在处理的元素在数组中的索引。
-
array
可选调用了
filter
的数组本身。
-
-
thisArg
可选执行
callback
时,用于this
的值。
返回值
一个新的、由通过测试的元素组成的数组,如果没有任何数组元素通过测试,则返回空数组。
描述
filter
为数组中的每个元素调用一次 callback
函数,并利用所有使得 callback
返回 true 或等价于 true 的值的元素创建一个新数组。callback
只会在已经赋值的索引上被调用,对于那些已经被删除或者从未被赋值的索引不会被调用。那些没有通过 callback
测试的元素会被跳过,不会被包含在新数组中。
filter
不会改变原数组,它返回过滤后的新数组。
实例
- 获取一个数组中的偶数
let arr = [1,2,3,4,5,6,7,8,9,10];
let newArr = arr.filter(value => {
return value % 2 === 0
})
console.log(newArr) //输出 [2,4,6,8,10]
- 获取数组中数值小于10的值
let arr = [10,20,8,5,9,30,60]
let newArr = arr.filter(value => {
return value < 10
})
console.log(newArr1) //[8, 5, 9]
- filter函数对数组对象的处理
//获取年龄小于18的学生信息
let studentInfos = [
{name:"张三",age:18},
{name:"李四",age:16},
{name:"王五",age:15},
{name:"赵柳",age:17},
{name:"田七",age:20},
{name:"王甜甜",age:19}
]
let newInfos = studentInfos.filter(value => {
return value.age < 18
})
console.log(newInfos); //输出 [ {name:"李四",age:16}, {name:"王五",age:15}, {name:"赵柳",age:17}]
- 手写一个filter函数
Array.prototype.myFilter = function(fn,thisValue){
if(typeof fn !== 'function'){
throw new Error("fn不是一个函数")
}
if([null,undefined].includes(this)){
throw new Error(`this 是null 或者 undefined`)
}
let arr = Object(this)
let filterArr = [];
for(let i in arr){
if(fn.call(thisValue,arr[i],i,arr)){
filterArr.push(arr[i])
}
}
return filterArr;
}
let arr2 = [1,23,4,56,7,8,9];
let newArr2 = arr2.myFilter(value => {
return value < 10
})
console.log(newArr2) //[1, 4, 7, 8, 9]
今天就到这里了,总结这些东西主要是加深印象,帮助自己更好的学习和理解filter函数,同时也希望对你们有所帮助。谢谢!