数组的遍历方式和筛选（简易）

最新推荐文章于 2025-05-13 22:00:00 发布

柴九哥-

最新推荐文章于 2025-05-13 22:00:00 发布

阅读量1.4k

点赞数

CC 4.0 BY-SA版权

分类专栏： webApi 文章标签： javascript

本文链接：https://blog.csdn.net/m0_66333916/article/details/124037405

webApi 专栏收录该内容

6 篇文章

订阅专栏

这篇博客详细介绍了JavaScript中常见的数组遍历方法，包括使用for循环、for...in...、forEach、filter和map。示例代码展示了如何遍历数组以及如何筛选和转换数组元素。内容覆盖了数组的基本操作，适合初学者和进阶者学习。

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

常用的几种方法：

1、用for循环遍历

2、用for...in...方式遍历

3、用forEach方式

4、用filter，具备筛选过滤数组中满足需要的函数
filter() 方法创建一个新数组, 其包含通过所提供函数实现的测试的所有元素。
语法：var newArray = arr.filter(callback(element[, index[, array]])[, thisArg])

5、map方法：可以循环遍历原数组，然后根据新的要求输出一个新的数组

 <script>
        //数组的遍历方式和筛选

        //1、用for循环遍历
        let arr = [1, 2, 3, 4, 5]
            //i的取值是根据数组的长度，不能超过数组的长度遍历,超过的显示undefined
        for (let i = 0; i < arr.length; i++) {
            //依次输出数组中的每个元素
            console.log(arr[i]);
        }


        //2、用for...in...方式遍历
        let arr = [1, 2, 3, 4, 5]
        for (let index in arr) {
            // index从0开始对应数组长度
            console.log(arr[index]); //1，2，3，4，5
        }


        //3、用forEach方式
        let arr = [1, 2, 3, 4, 5]
        arr.forEach(function(value, index) {
            console.log(value + '------' + index);
            // value代表数组中的值
            //index代表是数组的第几个，从0开始
        })

        // 4、用filter，具备筛选过滤数组中满足需要的函数
        // filter() 方法创建一个新数组, 其包含通过所提供函数实现的测试的所有元素。 
        // 语法：var newArray = arr.filter(callback(element[, index[, array]])[, thisArg])
        let arr = [1, 2, 3, 4, 5]
        let newArr = arr.filter(function(value, index) {
            return value > 2 //筛选数组中大于2的元素
        })
        console.log(newArr); //输出的是大于2的新数组

        //5、map方法：可以循环遍历原数组，然后根据新的要求输出一个新的数组
        var numbers = [1, 4, 9];
        var doubles = numbers.map(function(num) {
            return num * 2;
        });
        console.log(doubles); // doubles数组的值为： [2, 8, 18]
        console.log(numbers); // numbers数组未被修改： [1, 4, 9]
    </script>

注：个人学习记录，欢迎指正！