Ads by ProfitSence
Close

Método Array.filter()

Last Updated on jueves 6º oct. 2022

Filter JS

The filter() el método crea una nueva matriz con elementos de matriz que supera una prueba.

El método filter() toma una función de devolución de llamada que tiene 3 argumentos.

filter() no cambia la matriz original.

  • El item valor
  • El item índice
  • El array Sí mismo

Sintaxis

			
					arr.filter(callback(element[, index, [array]])[, thisArg])

			
	

JavaScript Filter

			
					let Ciudades = [
    {nombre: 'Madrid', población: 2824000},
    {nombre: 'Barcelona', población: 1454000},
    {nombre: 'Sevilla', población: 695000},
    {nombre: 'Bilbao', población: 351000}
];

			
	

Para encontrar la ciudad cuya población es superior a 1 millón.Normalmente, se hace un bucle sobre los elementos de la matriz mediante un bucle for y se prueba si el valor de la propiedad población satisface la condición.

			
					let grandes = [];
for (let i = 0; i < Ciudades.length; i++) {
    if (Ciudades[i].población > 1000000) {
        grandes.push(Ciudades[i]);
    }
}
console.log(grandes);

			
	
			
					[
  { nombre: 'Madrid', población: 2824000 },
  { nombre: 'Barcelona', población: 1454000 }
]

			
	

JavaScript Array proporciona el método filter() que le permite realizar esta tarea de una manera más corta y limpia.

			
					let grandes = Ciudades.filter(function (e) {
    return e.población > 1000000;
});
console.log(grandes);

			
	

En ES6, es aún más limpio cuando se utiliza la función de flecha (=>).

			
					let grandes = Ciudades.filter(ciudad => ciudad.población > 1000000);
console.log(grandes);

			
	
			
					let juegos = ['MineCraft', 'FortNite', 'Contra'];
console.log(juegos.filter(function(juego) {
    return juego == 'FortNite';
}));

			
	

En ES6, es aún más limpio cuando se utiliza la función de flecha (=>).

			
					console.log(juegos.filter(juego => juego === 'FortNite'))

			
	
			
					const data = [
  {
        id: 1,
        nombre: 'John Doe',
        ubicación: {
            ciudad: 'São Paulo',
            estado: 'SP',
            país: 'Brazil'
        }
    },
    {
        id: 2,
        nombre: 'Doe John',
        ubicación: {
            ciudad: 'Rio de Janeiro',
            estado: 'RJ',
            país: 'Brazil'
        }
    },
    {
        id: 3,
        nombre: 'Joe Dohn',
        ubicación: {
            ciudad: 'Curitiba',
            estado: 'SP',
            país: 'Brazil'
        }
    }
]

const newData = data.filter(each => each.ubicación.estado === 'SP');

console.log(newData)

			
	

La idea básica del método filter() es

  • Pasar al método filter() una función que
    • Recibe el elemento actual de la matriz de datos que está filtrando
    • Haz tu lógica
    • Devuelve un booleano