JS过滤数组|极客笔记

JS过滤数组

在JavaScript中，过滤数组是一种常见且有用的操作。当我们需要从一个数组中筛选出满足特定条件的元素时，就可以使用数组的filter()方法来实现。

filter()方法的使用

filter()方法是JavaScript数组原型上的一个内置方法，它接受一个回调函数作为参数，该回调函数会在数组的每个元素上调用一次。回调函数接受三个参数：当前元素的值、当前元素的索引、数组本身。

回调函数需要返回一个布尔值，如果返回值为true，则当前元素会保留在过滤后的数组中；如果返回值为false，则当前元素会被过滤掉。

下面是一个简单的示例，演示如何使用filter()方法过滤数组中的偶数：

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

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

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

在上面的示例中，我们首先定义了一个数组numbers，然后使用filter()方法筛选出了所有的偶数，并将结果保存在evenNumbers中，最后输出了过滤后的数组。

过滤器函数示例

除了简单的数值比较，我们还可以使用更复杂的条件来定义过滤器函数。比如，我们可以根据字符串的长度来筛选出符合条件的元素。

const words = ['apple', 'banana', 'orange', 'kiwi', 'pineapple'];

const longWords = words.filter(word => word.length > 5);

console.log(longWords); // ['banana', 'orange', 'pineapple']

在上面的示例中，我们定义了一个数组words，然后使用filter()方法根据单词的长度大于5来过滤数组，在最后输出。

使用箭头函数

在上面的示例中，我们使用了箭头函数来定义过滤器函数，箭头函数是ES6中引入的一种新的函数语法，使得函数的定义更加简洁和清晰。

除了箭头函数，我们也可以使用普通的匿名函数来定义过滤器函数：

const numbers = [10, 20, 30, 40, 50];

const filteredNumbers = numbers.filter(function(num) {
  return num > 30;
});

console.log(filteredNumbers); // [40, 50]

在这个示例中，我们定义了一个匿名函数，函数体内部的逻辑和箭头函数的写法是一样的，只是函数的写法略微不同。