如何在 JavaScript 中使用 filter() 数组方法

介绍

过滤() 数组方法创建一个新的数组,其中包含来自现有数组的属于给定标准的元素。

在本文中,您将了解有关 filter() Array 方法。

前提条件

如果您想跟随这篇文章,您将需要:

在数组中使用 filter()

filter()的语法类似于:

1var newArray = array.filter(function(item) {
2  return condition;
3});

元素参数是指数中的当前元素,因为过滤()对其进行条件的检查,在对象的情况下,这对访问属性有用。

如果当前的项目通过了条件,它会返回到新的数组。

考慮這個數字範圍的例子:

1var numbers = [1, 3, 6, 8, 11];

然后应用filter(),返回所有大于7的数字:

1var greaterThanSeven = numbers.filter(function(number) {
2  return number > 7;
3});
4
5console.log(greaterThanSeven);

此代码将生成一个新的过滤数组:

1[secondary_label output]
2[8, 11]

返回两个大于 7 的数组。

在对象集群中使用 filter()

一个常见的过滤()的用例是通过其属性对象的数组。

考虑这个生物对象的示例阵列:

1var creatures = [
2  {name: "Shark", habitat: "Ocean"},
3  {name: "Whale", habitat: "Ocean"},
4  {name: "Lion", habitat: "Savanna"},
5  {name: "Monkey", habitat: "Jungle"}
6];

然后应用过滤器()来返回所有具有栖息地的生物,等于海洋:

1var aquaticCreatures =  creatures.filter(function(creature) {
2  return creature.habitat == "Ocean";
3});
4
5console.log(aquaticCreatures);

此代码将生成一个新的过滤数组:

1[secondary_label Output]
2[ {name: "Shark", habitat: "Ocean"}, {name: "Whale", habitat: "Ocean"} ]

返回了两个有海洋栖息地的生物的数组。

结论

在本文中,您了解了 filter() Array 方法。

有关详细信息,请参阅 MDN Reference on filter()。

Filter 只是 JavaScript 中的数组的几种迭代方法之一,请阅读 How To Use Array Iteration Methods in JavaScript以了解其他方法,如 map() 和 reduce()。

Published At
Categories with 技术
Tagged with
comments powered by Disqus