js数组的filter()函数

本文详细介绍了JavaScript数组中的filter方法的使用方式,包括其参数、返回值及应用场景,并通过实例展示了如何利用filter来筛选数组元素。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

js数组的filter函数

  • 返回值:一个新数组
  • 参数:一个回调函数,回调函数有3个参数,依次是value,index,array
  • 作用:用来过滤掉一个数组中你不需要的元素

1.提取一个数组中你需要的元素

var arr=[1,2,3];
var newArr = arr.filter(
(value,index,array)=>{
    return value>1;//遍历数组,如果如果返回true则将该元素存储到新数组中
});
console.log("newArray:",newArr);//newArray:  [2, 3]
console.log("arr:",arr);//arr: [1, 2, 3]

2.回调函数直接return true

var arr=[1,2,3];
var newArr=arr.filter(
(value,index,array)=>{
    return true;//返回该数据所有元素
});
console.log("newArray:",newArr);//newArray:  [1, 2, 3]
console.log("arr:",arr);//arr: [1, 2, 3]

3.回调函数return false

var arr=[1,2,3];
var newArr=arr.filter(
(value,index,array)=>{
    return false;//返回空数据
});
console.log("newArray:",newArr);//newArray: []
console.log("arr:",arr);//arr: [1, 2, 3]

4.回调函数没有return 语句,相当于return false,返回空数组

var arr=[1,2,3];
var newArr=arr.filter(
(value,index,array)=>{
    //没有return语句
});
console.log("newArray:",newArr);//newArray:  []
console.log("arr:",arr);//arr: [1, 2, 3]
### JavaScript数组 `filter` 函数的使用 #### 示例 考虑一个简单的例子来展示如何利用 `filter` 方法筛选出偶数: ```javascript const numbers = [1, 2, 3, 4, 5]; const evenNumbers = numbers.filter(function(number) { return number % 2 === 0; }); console.log(evenNumbers); ``` 上述代码创建了一个名为 `numbers` 的数组,其中包含了五个整数值。通过调用 `.filter()` 并传递匿名函数作为参数,该匿名函数接收单个参数 `number` 表示当前迭代到的元素。如果此元素能被2整除,则将其加入新构建的结果集中;最终打印出来的将是 `[2, 4]` 这样的输出[^2]。 为了使代码更加简洁明了,在现代浏览器环境下可以采用箭头函数表达方式重写上面的例子: ```javascript const arr = [10, 20, 30]; const newArr = arr.filter(item => item >= 20); console.log(newArr); ``` 这段代码同样实现了过滤操作,不过这里只保留那些大于等于20的项,并将它们存储到了新的变量 `newArr` 当中[^4]。 #### 语法解析 `filter` 是一种高阶函数,其基本形式如下所示: ```plaintext array.filter(callback(currentValue[, index[, array]])[, thisArg]) ``` - **callback**: 对每一个元素都会执行一次这个回调函数,用来决定是否应该包含该项于结果集内。 - **currentValue**: 正在处理的那个具体项目的值。 - **index** *(optional)*: 可选项,代表目前正访问着的位置编号。 - **array** *(optional)*: 可选项,指代整个源数据集合本身。 - **thisArg** *(optional)*: 执行上下文中所使用的对象实例,默认情况下为全局环境下的窗口(window),但在严格模式下则会是 undefined 。当提供时,它会被当作内部调用期间的方法主体内的 "this" 关键字指向的对象。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值