轻松掌握数组过滤方法filter，解锁数据筛选新技能

2023-09-30 05:21:37

JavaScript 数组过滤方法详解：提升数据筛选效率

在 JavaScript 的编程世界中，数组是不可或缺的数据结构，而数组过滤方法 filter 则是处理数组数据的利器。filter 方法让我们能够轻松地从数组中筛选出符合特定条件的元素，从而实现高效的数据处理。

一、filter 方法简介

filter 方法是 JavaScript 数组的一个内置方法，它接受一个回调函数作为参数，该回调函数负责对数组中的每个元素进行测试。如果回调函数返回 true，则该元素将保留在筛选后的新数组中，否则将被过滤掉。

二、filter 方法语法

array.filter(function(element, index, array) {
  // 返回 true 以保留元素，返回 false 以过滤元素
});

element： 数组中的当前元素。
index： 当前元素在数组中的索引。
array： 包含当前元素的数组。

三、filter 方法实例

为了更好地理解 filter 方法的用法，让我们来看几个实际应用的例子：

案例 1：从数组中筛选出偶数

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

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

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

案例 2：从数组中筛选出特定字符串

const names = ['John', 'Mary', 'Bob', 'Alice', 'Tom'];

const namesWithA = names.filter(function(name) {
  return name.includes('A');
});

console.log(namesWithA); // ['John', 'Mary', 'Alice']

案例 3：从数组中筛选出符合条件的对象

const products = [
  { name: 'iPhone', price: 1000 },
  { name: 'iPad', price: 800 },
  { name: 'MacBook', price: 1500 },
  { name: 'Apple Watch', price: 500 }
];

const expensiveProducts = products.filter(function(product) {
  return product.price > 1000;
});

console.log(expensiveProducts); // [{ name: 'iPhone', price: 1000 }, { name: 'MacBook', price: 1500 }]