js array filter数组的筛选方法|极客笔记

js array filter数组的筛选方法

介绍

JavaScript中的数组是一种非常重要的数据结构，它允许我们在一个变量中存储多个值。而在实际开发中，我们常常需要对数组进行筛选，从中提取我们关注的数据。JavaScript中提供了许多方法来实现数组的筛选操作，其中之一就是filter()方法。

filter()方法是数组对象的一个内置方法，它可以用于创建一个新的数组，新数组中的元素是通过对原数组中的元素进行筛选后得到的。本文将详细介绍filter()方法的使用方法和应用场景，并给出一些代码示例。

`filter()`方法的语法

filter()方法的语法如下：

array.filter(callback[, thisArg])

其中：

array是要进行筛选操作的数组。
callback是一个回调函数，用于定义筛选的条件。
thisArg是可选参数，用于指定callback函数内部的this的值。

callback函数接受三个参数：element表示当前遍历的元素，index表示当前遍历的索引，array表示正在操作的数组。

callback函数的返回值决定了对应元素是否被筛选出来。当返回值为true时，表示该元素应被包含在新数组中；当返回值为false时，表示该元素应被排除在新数组之外。

filter()方法返回一个新的数组，这个数组中包含了满足筛选条件的元素。

`filter()`方法的应用场景

filter()方法可用于许多实际场景中。比如：

从一组数字中筛选出所有的偶数。
从一个字符串数组中筛选出所有包含特定字符的字符串。
从一个对象数组中筛选出满足某一属性条件的对象。

下面我们就通过一些代码示例，来详细了解filter()方法的应用。

示例代码

示例1：从一组数字中筛选出所有的偶数

const numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];

const evenNumbers = numbers.filter((number) => number % 2 === 0);

console.log(evenNumbers);

输出：

[2, 4, 6, 8, 10]

上述示例中，我们定义了一个数组numbers，它包含了一组数字。然后使用filter()方法对数组进行筛选，通过判断元素是否为偶数来决定是否将其保留在新数组中。最后，打印出筛选结果evenNumbers。

示例2：从一个字符串数组中筛选出所有包含特定字符的字符串

const strings = ['apple', 'banana', 'cherry', 'date'];

const keyword = 'a';

const filteredStrings = strings.filter((str) => str.includes(keyword));

console.log(filteredStrings);

输出：

['apple', 'banana']

在这个示例中，我们有一个字符串数组strings，它包含了一些水果名称。我们想筛选出所有包含字母’a’的水果名称。使用filter()方法结合includes()方法来判断是否包含特定字符，最后得到满足条件的结果数组filteredStrings。

示例3：从一个对象数组中筛选出满足某一属性条件的对象

const students = [
  { name: 'Alice', age: 20, score: 85 },
  { name: 'Bob', age: 22, score: 90 },
  { name: 'Cathy', age: 21, score: 80 },
  { name: 'Dan', age: 23, score: 95 }
];

const passedStudents = students.filter((student) => student.score >= 85);

console.log(passedStudents);

输出：

[
  { name: 'Alice', age: 20, score: 85 },
  { name: 'Bob', age: 22, score: 90 },
  { name: 'Dan', age: 23, score: 95 }
]

在这个示例中，我们有一个对象数组students，每个对象都包含了学生的姓名、年龄和分数。我们想筛选出分数大于等于85分的学生。使用filter()方法结合条件判断，最后得到满足条件的学生数组passedStudents。

总结

通过以上示例，我们了解了JavaScript中filter()方法的基本使用方法和应用场景。这个方法非常强大，可以方便地筛选数组中的元素，并返回一个新的数组。无论是筛选数字、字符串，还是对象，filter()方法都能派上用场。

js array filter数组的筛选方法