JavaScript Array filter() 方法详解与实战

作者:纸飞机

时间:2026-10-23

浏览:468

本文介绍JavaScript中Array的filter()方法,该方法接收回调函数,根据返回值true或false筛选数组元素。通过保留奇数和去除空字符串两个示例,展示如何编写筛选逻辑,并附带去除空字符串时需注意IE9以下版本无trim()方法的问题,最后提供筛选素数的练习。

文章目录

filter() 方法概述

filter是JavaScript中一个常用的数组操作方法,其核心功能是从原数组中剔除不符合条件的元素,并返回包含剩余元素的新数组。

与map()类似,filter()也接收一个回调函数作为参数。不同之处在于,map()将回调函数作用于每个元素以生成新值,而filter()则依据回调函数的返回值(true或false)来决定是否保留该元素。

例如,若需从一个数组中剔除偶数,仅保留奇数,代码实现如下:

筛选奇数示例


var arr = [1, 2, 4, 5, 6, 9, 10, 15];
var r = arr.filter(function (x) {
  return x % 2 !== 0;
});
r; // [1, 5, 9, 15]

另一个常见场景是清理数组中的空字符串,具体写法如下:

去除空字符串与兼容性注意


var arr = ['A', '', 'B', null, undefined, 'C', ' '];
var r = arr.filter(function (s) {
  return s && s.trim(); // 注意:IE9以下的版本没有trim()方法
});
r; // ['A', 'B', 'C']

由此可见,使用filter()高阶函数的核心在于正确编写“筛选”回调函数。

实践练习:筛选素数

练习

请尝试利用filter()方法,从一组数字中筛选出所有的素数。

实用工具推荐

电子包浆

绿化、压缩、噪点和虚拟水印,自由调节做旧程度。

使用 ›
图片压缩

选择画质和输出格式,预览压缩前后的大小。

使用 ›
相关文章