JS数组过滤filter|极客笔记

JS数组过滤filter

在JavaScript中，数组是一种非常常用的数据结构，而数组的过滤操作是我们在开发过程中经常会用到的一个功能。在JavaScript中，我们可以使用filter()方法来过滤数组中的元素，只保留满足指定条件的元素，返回一个新的数组。

使用方法

filter()方法接受一个函数作为参数，这个函数会被传入数组中的每一个元素，然后根据这个函数的返回值来决定是否将该元素保留在新数组中。如果函数返回true，则该元素会被保留，否则会被过滤掉。

const numbers = [1, 2, 3, 4, 5];

const evenNumbers = numbers.filter(function(number) {
    return number % 2 === 0;
});

console.log(evenNumbers); // [2, 4]

在上面的示例中，我们定义了一个数组numbers，然后使用filter()方法来过滤出其中的偶数，然后将结果存储在evenNumbers中。最后，我们将evenNumbers打印出来，结果为[2, 4]。

示例

下面我们来看一个更加复杂的示例，假设我们有一个包含对象的数组，每个对象包含学生的姓名和分数，我们需要过滤出分数大于等于80的学生：

const students = [
    { name: 'Alice', score: 90 },
    { name: 'Bob', score: 85 },
    { name: 'Charlie', score: 75 },
    { name: 'David', score: 95 }
];

const topStudents = students.filter(function(student) {
    return student.score >= 80;
});

console.log(topStudents);

上面的代码中，我们定义了一个包含学生信息的数组students，然后使用filter()方法来过滤出分数大于等于80的学生，将结果存储在topStudents中。最后，我们将topStudents打印出来，结果为：

[
    { name: 'Alice', score: 90 },
    { name: 'Bob', score: 85 },
    { name: 'David', score: 95 }
]

进阶用法

除了传入一个普通的函数作为参数外，我们还可以使用箭头函数来简化代码。下面是上面示例的改写：

const topStudents = students.filter(student => student.score >= 80);

使用箭头函数可以让代码更加简洁易读。

此外，filter()方法还可以接受第二个参数，用于指定函数中的this对象。同时，在回调函数中，我们还可以获得当前元素的索引值和原数组本身。这样就可以更加灵活地进行过滤操作。

总结

filter()方法是JavaScript中非常强大和方便的数组操作方法，能够帮助我们轻松地过滤出符合条件的元素。在日常开发中，我们经常会用到这个方法来处理数组数据。熟练掌握filter()方法的使用，将会极大地提高我们的开发效率。

JS数组过滤filter