JS Array.filter()方法

本文介绍了JavaScript中Array的filter()方法的使用方式及原理。通过一个示例代码详细讲解了如何利用filter()方法筛选数组中符合条件的元素,并创建新的数组。

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

今天学习了Array的filter方法,MDN上解释的是filter()方法中行参是一个回调函数.这个回调函数就是一个规则,返回一个布尔值.filter()方法会对数组中每一个元素使用这个回调函数.注意,这里说的是每一个元素.并且将返回值为true的元素装入一个新数组返回.代码如下:
    var arr = ["关羽","woi","赵子龙","马zi超","黄忠"];
    var arr1= arr.filter(function(ele,index,array){
        if(ele.length>2){
            return true;
        }
        return false;
    })
    console.log(arr);
    console.log(arr1);

这里定义的function是判断元素的长度,如果大于2 返回true....可是return不是结束function吗?答案是yes.那既然是这样,在控制台输出"赵子龙"的时候filter()这个方法应该结束了啊.其实不然.

return只是结束掉了定义的function,而filter()这个方法内部有一个类似for循环的句式对元素进行依次判断function的功能

<< `Array.prototype.filter()` 是 JavaScript 中数组的一个高阶方法,用于创建一个新数组,其中包含所有通过测试的元素。这个“测试”由我们提供的回调函数定义。 ### 语法: ```javascript array.filter(callback(element[, index[, array]])[, thisArg]) ``` - **callback**:用来检测每个元素是否符合条件的函数。 - `element`:当前正在处理的元素。 - `index(可选)`:当前正在处理的索引值。 - `array(可选)`:调用 filter 方法的那个数组。 - **thisArg(可选)**:执行 callback 时,指定作为 `this` 的值。 --- ### 示例代码: #### 过滤出大于18岁的用户 ```javascript const users = [ { name: 'Alice', age: 25 }, { name: 'Bob', age: 17 }, { name: 'Charlie', age: 20 } ]; const adults = users.filter(user => user.age >= 18); console.log(adults); // 输出 [{name: "Alice", age: 25}, {name: "Charlie", age: 20}] ``` --- #### 删除字符串中的空格字符 ```javascript let arr = ['a', '', 'b', null, 'c']; let filteredArr = arr.filter(item => item !== ''); // 移除空串和null等无效数据 console.log(filteredArr); // ["a", "b", "c"] ``` --- ### 注意事项: 1. 如果回调函数返回的是 `true` 或其他真值,则保留该元素;如果返回假值,则丢弃该元素。 2. 不会对空数组进行操作。 3. 原始数组不会被修改,而是返回一个新的数组。 --- ### 性能考虑: 对于非常大的数组,频繁使用 `.filter()` 可能会导致性能下降,因为每次都需要遍历整个数组并分配新的内存空间存储结果。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值