Cómo filtrar matrices en JavaScript, con ejemplos

Hemos cubierto matrices en JavaScript bastante extensamente en LinuxScrew. Este artículo le mostrará cómo usar el filtro método:con ejemplos fáciles de seguir.

Matrices de JavaScript

Las matrices son un tipo de variable que contiene una lista de otros valores o variables. Son uno de los fundamentos de la programación informática.

Estas listas contienen elementos en posiciones (llamadas índices ). Estos elementos pueden ser cualquier cosa:números, cadenas, objetos complejos, lo que desee almacenar.

Las matrices son muy útiles. Puede usarlos para almacenar las filas en una tabla para los cálculos, o puede usarlos para mantener referencias a todos los malos en su videojuego para que pueda encontrarlos rápidamente y actualizar su estado en el juego.

Matrices de filtrado

En el contexto de las matrices de JavaScript, filtrar significa tomar la matriz original, eliminar los elementos de la matriz que no coinciden con los criterios especificados – y devolver una copia de la matriz original con esos elementos eliminados.

Por ejemplo, es posible que tenga una variedad de tipos malos en su juego:algunos tipos malos son rojos, algunos tipos malos son azules. Puede escribir un filtro para obtener una nueva matriz que contenga solo los malos azules.

La matriz JavaScript filtro() Método

El filtro() El método disponible en las matrices proporciona una forma conveniente de realizar este filtrado. Puede proporcionarle cualquier criterio y devolverá una matriz que contiene solo los elementos que coinciden con esos criterios.

array.filter(item => filter_function);

Tenga en cuenta que:

  • matriz puede ser cualquier variable de matriz
  • elemento es el nombre de la variable que se asignará a cada elemento de la matriz dentro de la función_filtro
  • función_filtro es una función o declaración que debería devolver un booleano (VERDADERO o FALSO) valor

La función de filtro solo necesita devolver un valor booleano VERDADERO o FALSO (manualmente o como resultado del uso de un comparador); si el valor no es VERDADERO, el elemento se eliminará de la matriz resultante.

Ejemplos

Aquí está en acción:

var furniture = ['chair', 'bed', 'couch', 'table'];
var startsWithC = furniture.filter(item => item[0]  == 'c'); // [ "chair", "couch" ]

Arriba, definimos una serie de muebles.

Luego, creamos un nuevo matriz que contiene valores filtrados de la primera matriz, en este caso verificando que el primer carácter en el nombre del mueble sea la letra 'c'.

Esto se hace con expresiones de función de flecha – una forma corta de escribir una función de una sola línea. A cada elemento de la matriz se le asigna el nombre de variable elemento , y la función de una línea que se usará para filtrar se coloca después de la flecha (=> ).

Es posible escribir filtros más complejos con múltiples criterios utilizando una forma más larga de la expresión de la función de flecha, donde se devuelve una expresión más compleja del código entre llaves ({} ):

var furniture = ['chair', 'bed', 'couch', 'table'];
var filteredItems = furniture.filter(item => {
    console.log('Checking item: ' + item)
    if (item[0]  == 'c'){
        return true;
    } else if(item.length < 4){
        return true;
    }
    else {
        return false;
    }
}); // [ "chair", "bed", "couch" ]

Arriba, se toman varias acciones en la función de filtro. El elemento se imprime en la consola y luego se verifica con dos condiciones:si comienza con c o tiene menos de 3 letras.

Vea estas otras cosas útiles que puede hacer con las matrices de JavaScript:

  • Cómo comparar matrices en JavaScript, con ejemplos
  • Recorriendo Array usando JavaScript forEach(), con ejemplos
  • Método Array slice() en JavaScript, con ejemplos
  • Comprobar que la matriz contiene un valor en JavaScript, con ejemplos
  • Eliminar un elemento de una matriz en JavaScript, con ejemplos