filter是JavaScript数组方法,创建新数组包含满足回调函数条件的元素;不修改原数组,回调需返回布尔值,true元素保留,常用于对象数组属性筛选。

filter 是 JavaScript 数组的内置方法,用于创建一个新数组,包含所有通过指定条件(回调函数)的元素。它不会修改原数组,而是返回符合条件的元素组成的新数组。
基本语法和使用方式
调用形式为:array.filter(callback(element, index, array)),其中:
- callback:必需,每次遍历元素时执行的函数
- element:当前正在处理的数组元素(必传)
- index:当前元素的索引(可选)
- array:调用 filter 的原始数组(可选)
- 回调函数需返回布尔值;返回 true 的元素会被保留在新数组中
常见过滤场景示例
假设有一个用户数组:
const users = [
{ name: '张三', age: 25, active: true },
{ name: '李四', age: 30, active: false },
{ name: '王五', age: 22, active: true }
];
- 筛选活跃用户:
users.filter(user => user.active) - 筛选年龄大于 23 的用户:
users.filter(user => user.age > 23) - 筛选名字含“三”的用户:
users.filter(user => user.name.includes('三'))
注意点和易错细节
- filter 不会跳过空位(稀疏数组中 undefined 或空槽仍会触发回调,但 element 是 undefined)
- 如果回调没写 return,或返回了 falsy 值(如
undefined、null、0、false),该元素不会进入结果数组 - 想基于索引或原数组做判断,记得在回调中声明对应参数,例如:
arr.filter((x, i) => i % 2 === 0)取偶数索引项 - filter 对象数组时,不能直接用
===比较对象,应比属性值(如user.id === targetId)
和其它方法的区别
- vs find:filter 返回数组(可能多个/空),find 只返回第一个匹配项(或 undefined)
- vs map:map 是转换每个元素,filter 是筛选元素,不改变值本身
- vs reduce:reduce 更灵活,可实现 filter 功能,但 filter 语义更清晰、代码更简洁


















