El método de JavaScript Array filter () devuelve una nueva matriz con todos los elementos que pasan la prueba definida por la función dada.
La sintaxis del filter()
método es:
arr.filter(callback(element), thisArg)
Aquí, arr es una matriz.
filter () Parámetros
El filter()
método incluye:
- callback - La función de prueba que se ejecuta en cada elemento de la matriz; devuelve
true
si el elemento pasa la prueba, de lo contrariofalse
. Toma en:- elemento: el elemento actual que se pasa de la matriz.
- thisArg (opcional): el valor que se utilizará
this
al ejecutar la devolución de llamada. Por defecto, lo esundefined
.
Valor de retorno del filtro ()
- Devuelve una nueva matriz con solo los elementos que pasaron la prueba.
Notas :
filter()
no cambia la matriz original.filter()
no se ejecutacallback
para elementos de matriz sin valores.
Ejemplo 1: filtrado de valores de Array
const prices = (1800, 2000, null, 3000, 5000, "Thousand", 500, 8000) function checkPrice(element) ( return element> 2000 && !Number.isNaN(element); ) let filteredPrices = prices.filter(checkPrice); console.log(filteredPrices); // ( 3000, 5000, 8000 ) // using arrow function let newPrices = prices.filter((price) => (price> 2000 && !Number.isNaN(price))); console.log(newPrices); // ( 3000, 5000, 8000 )
Salida
(3000, 5000, 8000) (3000, 5000, 8000)
Aquí, todos los números menores o iguales que 2000 y todos los valores no numéricos se filtran.
Ejemplo 2: búsqueda en matriz
const languages = ("JavaScript", "Python", "Ruby", "C", "C++", "Swift", "PHP", "Java"); function searchFor(arr, query) ( function condition(element) ( return element.toLowerCase().indexOf(query.toLowerCase()) !== -1; ) return arr.filter(condition); ) let newArr = searchFor(languages, "ja"); console.log(newArr); // ( 'JavaScript', 'Java' ) // using arrow function const searchArr = (arr, query) => arr.filter(element => element.toLowerCase().indexOf(query.toLowerCase()) !== -1); let newLanguages = searchArr(languages, "p"); console.log(newLanguages); // ( 'JavaScript', 'Python', 'PHP' )
Salida
('JavaScript', 'Java') ('JavaScript', 'Python', 'PHP')
Aquí, tanto el elemento como la consulta se convierten a minúsculas, y el método indexOf () se usa para verificar si la consulta está presente dentro del elemento. Los elementos que no pasan esta prueba se filtran.
Lectura recomendada: mapa de matriz de JavaScript ()