Как использовать метод массива filter() в JavaScript

Введение

Метод filter() Array создает новый массив с элементами, которые подпадают под заданные критерии из существующего массива.

В этой статье вы узнаете о методе массива filter().

Предпосылки

Если вы хотите следовать этой статье, вам понадобятся:

• Некоторое знакомство с массивами JavaScript.
• Некоторое знакомство с функциями JavaScript.

Использование filter() для массива чисел

Синтаксис для filter() выглядит следующим образом:

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

Аргумент item является ссылкой на текущий элемент в массиве, так как filter() проверяет его на соответствие условию. Это полезно для доступа к свойствам в случае объектов.

Если текущий элемент соответствует условию, он возвращается в новый массив.

Рассмотрим этот пример массива чисел:

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

Затем примените filter(), чтобы вернуть все числа, превышающие 7:

var greaterThanSeven = numbers.filter(function(number) {
  return number > 7;
});

console.log(greaterThanSeven);

Этот код создаст новый отфильтрованный массив:

output
[8, 11]

Возвращается массив с двумя значениями больше 7.

Использование filter() для массива объектов

Обычный вариант использования filter() — массив объектов через их свойства.

Рассмотрим этот пример массива объектов creature:

var creatures = [
  {name: "Shark", habitat: "Ocean"},
  {name: "Whale", habitat: "Ocean"},
  {name: "Lion", habitat: "Savanna"},
  {name: "Monkey", habitat: "Jungle"}
];

Затем примените filter(), чтобы вернуть всех существ с средой обитания, равной Океану:

var aquaticCreatures =  creatures.filter(function(creature) {
  return creature.habitat == "Ocean";
});

console.log(aquaticCreatures);

Этот код создаст новый отфильтрованный массив:

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

Возвращается массив с двумя существами, обитающими в «Океане».

Заключение

В этой статье вы узнали о методе массива filter().

Дополнительные сведения см. в справочнике MDN по filter().

Фильтр — это только один из нескольких методов итерации для массивов в JavaScript. Прочтите статью «Как использовать методы итерации массива в JavaScript», чтобы узнать о других методах, таких как map() и reduce(). .