Cómo utilizar el método de matriz filter() en JavaScript

Introducción

El filter()método Array crea una nueva matriz con elementos que cumplen un criterio determinado de una matriz existente.

En este artículo aprenderá sobre el filter()método Array.

Prerrequisitos

Si deseas seguir este artículo, necesitarás:

• Algunos conocimientos sobre matrices de JavaScript .
• Algunos conocimientos de funciones de JavaScript .

Uso filter()de una matriz de números

La sintaxis para filter()se parece a:

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

El itemargumento es una referencia al elemento actual de la matriz, ya que filter()lo compara con condition. Esto resulta útil para acceder a propiedades, en el caso de objetos.

Si la corriente itempasa por condition, se devuelve a la nueva matriz.

Considere este ejemplo de matriz de números:

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

Luego aplique a filter()para devolver todos los números que sean mayores que 7:

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

Este código generará una nueva matriz filtrada:

output[8, 11]

Se devuelve una matriz con dos valores mayores que 7.

Uso filter()en una matriz de objetos

Un caso de uso común filter()es con una matriz de objetos a través de sus propiedades.

Considere este ejemplo de matriz de creatureobjetos:

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

Luego aplica a filter()para devolver todas las criaturas con a habitatque sea igual a Ocean:

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

Este código generará una nueva matriz filtrada:

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

Se devuelve una matriz con las dos criaturas que tienen un hábitat en el “Océano”.

Conclusión

En este artículo aprendiste sobre el filter()método Array.

Para obtener más detalles, consulte la Referencia MDN enfilter() .

El filtro es solo uno de varios métodos de iteración en matrices en JavaScript, lea Cómo usar métodos de iteración de matrices en JavaScript para obtener más información sobre otros métodos como map()y reduce().