Filtrar matriz de JavaScript con múltiples condiciones/valores [Ejemplos]

Este artículo le mostrará cómo filtrar una matriz utilizando múltiples condiciones para devolver múltiples valores. Se proporciona un código de ejemplo.

Ya hemos cubierto el filtrado de arreglos en general; este artículo cubre específicamente cómo se pueden usar varias condiciones con Array.filter() método.

El Array.filter() Método

El método filter() está disponible en todas las matrices en JavaScript. Crea una nueva matriz, que contiene solo los elementos de la matriz original que pasa todas las condiciones en una función proporcionada.

filtro() Sintaxis del método

La sintaxis de la matriz filter() método es el siguiente:

ARRAY.filter(ELEMENT => FUNCTION)

Tenga en cuenta que:

  • ARRAY es cualquier variable de matriz
  • ELEMENTO es el nombre que desea usar para la variable que se refiere a cada elemento de la matriz a medida que se prueba
  • FUNCIÓN es la función que probará cada ELEMENTO
    • Debe devolver VERDADERO o FALSO para que cada elemento decida si aparecerá en la matriz resultante
  • el filtro() El método devuelve una matriz que contiene solo los elementos en la ARRAY original. que coinciden con las condiciones en FUNCTION

Filtrado de arreglos usando múltiples condiciones

La función que decide si un elemento de la matriz original debe incluirse en la matriz resultante puede contener cualquier cantidad de condiciones; de hecho, es una función estándar de JavaScript, por lo que puede hacer prácticamente lo que quiera. desee en él, siempre y cuando devuelva un valor booleano VERDADERO al final para los elementos que desea ver incluidos en el resultado.

Ejemplo:Filtrado de números usando múltiples condiciones

A continuación, se define una matriz de números y luego se filtra según múltiples condiciones:

let numbers = [5, 7, 14, 29, 50, 16, 19];

let numbersFiltered = numbers.filter(function (currentElement) {
    return currentElement > 10 && currentElement < 20;
});

Los números filtrados matriz contendrá solo las entradas de la matriz original que son mayores que 10 y menores que 20

Se pueden agregar más condiciones:la siguiente función filtra los resultados a solo números entre 10 y 20 que son pares:

let numbersFiltered = numbers.filter(function (currentElement) {
    return currentElement > 10 && currentElement < 20 && currentElement % 2 == 0;
});

El ejemplo anterior usa el % operador, que devuelve el resto cuando el número que le precede se divide por el número que le sigue. Si el resto al dividirlo por 2 es 0 , el número es par.

Ejemplo:Filtrado de cadenas utilizando varias condiciones

A continuación, se define y filtra una matriz de cadenas usando múltiples condiciones:

let strings = ['dog', 'cat', 'bird', 'pig', 'giraffe', 'fox', 'bat'];
let stringsFiltered = strings.filter(function (currentElement) {
    return currentElement.startsWith('b') || currentElement.length > 4;
});

El stringsFilteredArray contendrá solo los elementos de la matriz original que comiencen con 'b' o aquellos con un número de caracteres superior a 4, lo que da como resultado:

[ "bird", "giraffe", "bat" ]

Ejemplo:Filtrado de objetos usando múltiples condiciones

A continuación, se define y filtra una matriz de objetos usando múltiples condiciones:

let cars = [
    {make: 'Ford', year: 1997, colour: 'yellow'},
    {make: 'GM', year: 1967, colour: 'red'},
    {make: 'Honda', year: 1988, colour: 'blue'},
    {make: 'Ford', year: 1985, colour: 'pink'},
];
let carsFiltered = cars.filter(function (currentElement) {
    let result = currentElement.year > 1980 && currentElement.year < 1990;
    result = result && currentElement.make == 'Ford';
    return result;
});

La condición se divide asignando el primer control (el año es entre 1980 y 1990) a una variable y luego realizando controles adicionales (si es un Ford) y actualizando la variable para reflejar si todos los controles han pasado, antes de devolverlo.