javascript中filter和forEach的用法

本文详细介绍了JavaScript中filter和forEach方法的使用技巧。filter方法通过回调函数筛选数组元素,返回符合条件的新数组;forEach方法遍历数组,对每个元素执行指定操作,但不返回任何值。文章还提供了多个示例来帮助理解这两个方法的应用场景。

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

1、JavaScript中filter的用法:
语法:array.filter(callback, thisObj);
参数:array(必须),数组对象;callback(必须),一个最多接受三个参数的函数(value, index, arr),数组中每个元素都会调用callback一次;thisObj(可选),callback中的this,省略时this为undefined。
返回值:回调函数为true时返回的所有项的集合(新数组)。
异常:如果callback不是函数对象,则引发TypeError异常。
回调函数语法:function callback(value, index, array); value,当前处理到的数组元素的值;index,当前处理到的数组元素的数字索引;array,包含当前处理元素的数组对象。
filter方法启动后:1、数组原始长度之外添加元素,添加的元素不会执行callback函数;2、向数组中缺少元素的位置添加元素,如果索引尚未到达该位置则添加的元素会执行callback函数;3、修改数组中元素,如果索引尚未到达修改的位置则修改后的元素执行callback函数;4、删除数组中元素,如果尚未执行则不会再执行。
filter用法:

    // 找出数组中的质数
        var numbers = [1, 2, 3, 4, 5];
        function CheckIfPrime(value, index, array) {
            var high = Math.floor(Math.sqrt(value));
            for(var div = 2; div <= high; div++) {
                if(value % div == 0) {
                    return false;
                }
            }
            return true;
        }
        var primes = numbers.filter(CheckIfPrime);
        document.write(primes);  // 1,2,3,5

        document.write("<br />");
        // 在 number 中找出范围为 obj 限定的整数
        var number = [12, "a", 9, "b", 16, "c", 6, "d", 14];
        var obj = {min: 10, max: 15};
        var result = number.filter(
                function (value) {
                    if(typeof value === 'string') {
                        return false;
                    }
                    else {
                        return value > this.min && value < this.max;
                    }
                }, obj);
        document.write(result);  // 12,14

        document.write("<br />");
        // 字符串使用filter函数,找到字符串中不为空或者a的所有字符
        var str = "I am a string";
        function CheckValue(value, index, arr) {
            return arr[index] != ' ' && arr[index] != 'a';
        }
        var subset = [].filter.call(str, CheckValue);
        document.write(subset);   // I,m,s,t,r,i,n,g

2、JavaScript中forEach的用法:
语法:array.forEach(callback, thisObj);
参数:array(必须),数组对象;callback(必须),一个最多接受三个参数的函数(value, index, arr),数组中每个元素都会调用callback一次;thisObj(可选),callback中的this,省略时this为undefined。
返回值:无返回值。
用法:

    // forEach
        var numbers = [1, 2, 3, 4];
        var obj = {min: 2, max: 4};
        // 带thisObj参数的用法
        numbers.forEach(function (value) {
            if(value > this.min && value <= this.max) {
                document.write(value + ',');
            }
        }, obj);  // 以上forEach输出:3,4,
        document.write("<br />");
        document.write(numbers);  // 1,2,3,4
forEach与filter的区别是forEach没有返回值而filter返回callback处理结果为true时返回的集合,其他用法基本相同,包括参数的使用。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值