js数组对象filter方法

2024年1月28日发(作者：)

js数组对象filter方法

JavaScript中的数组对象具有很多强大的方法，其中一个非常常用且重要的方法就是filter(方法。filter(方法允许我们根据指定的条件来筛选出符合要求的数组元素。

filter(方法接收一个函数作为参数，这个函数定义了筛选条件。该函数将会为每个数组元素调用一次，并返回一个布尔值来决定是否保留此元素。如果返回值为true，则该元素将保留在筛选后的数组中；如果返回值为false，则该元素将被从数组中删除。

filter(方法不会改变原始数组，而是返回一个新数组，其中包含符合条件的元素。

下面是一个例子：

```

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

let evenNumbers = (function(number)

return number % 2 === 0;

});

(evenNumbers); // 输出 [2, 4]

```

在上面的例子中，我们定义了一个numbers数组，其中包含1到5这5个数字。然后我们使用filter(方法来筛选出偶数，通过传递一个匿名函数作为filter(方法的参数。在这个匿名函数中，我们使用取余运算符

来判断一个数字是否为偶数。如果是偶数，我们返回true，表示要保留该数字；如果不是偶数，我们返回false，表示要删除该数字。最后，filter(方法返回一个新数组，该数组只包含偶数。我们将这个新数组赋值给evenNumbers变量，并在控制台打印出来。

除了匿名函数，我们也可以使用箭头函数来定义filter(方法的参数。例如：

```

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

let evenNumbers = (number => number % 2 === 0);

(evenNumbers); // 输出 [2, 4]

```

在这个例子中，我们使用箭头函数来定义匿名函数。它看起来更简洁，而且更容易阅读。

filter(方法还可以接收第二个参数，用于设置回调函数中的this值。例如：

```

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

let maximumNumber = 3;

let filteredNumbers = (function(number)

return number <= mNumber;

}, {maximumNumber: maximumNumber});

(filteredNumbers); // 输出 [1, 2, 3]

```

在上面的例子中，我们通过第二个参数传递一个对象，其中包含一个maximumNumber属性。在匿名函数中，我们使用了mNumber来访问这个属性。这样，我们可以在回调函数中访问到外部的变量。

filter(方法还有一个很有用的特性，就是可以链式调用。这意味着我们可以在一个filter(方法的结果上再次调用filter(方法。例如：

```

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

let filteredNumbers = (number => number % 2

=== 0)

.filter(number => number > 2);

(filteredNumbers); // 输出 [4]

```

在这个例子中，我们首先使用filter(方法来筛选出偶数。然后，我们在结果上再次调用filter(方法来筛选出大于2的数字。最终，我们得到一个只包含4的数组。

总结一下，filter(方法是一个非常强大和实用的方法，它允许我们按照自定义的条件来筛选数组元素。通过掌握filter(方法的使用，我们

可以更加灵活和高效地处理数组操作。无论是对于数据处理还是界面展示，filter(方法都是必不可少的工具之一