CodeForge

JavaScript de Cero a Experto / Arrays

filter y find: seleccionar elementos

Teoría20 min20 XP

A veces no quieres transformar toda la lista, sino QUEDARTE con algunos: los gastos grandes, los productos en oferta, el primer resultado que cumpla algo. filter y find son los métodos para SELECCIONAR. Junto a map, forman el trío que resuelve el 90% de lo que harás con listas.

El colador y la búsqueda

filter: quedarte con los que cumplen

filter recibe una función que devuelve true o false por cada elemento (la "prueba"), y devuelve un array NUEVO con los que dieron true. Como map, no toca el original. Si nada cumple, devuelve [] (array vacío, no undefined) — importante para no equivocarte al revisar el resultado.

find: el primero que cumple

find devuelve el PRIMER elemento que pasa la prueba (un solo valor, no una lista) y se detiene ahí — es eficiente cuando solo quieres uno. Si ninguno cumple, devuelve undefined (ojo con esto: siempre revisa que find encontró algo antes de usarlo). Su primo findIndex devuelve la POSICIÓN en vez del valor, útil cuando necesitas modificar ese elemento por su índice.

Tienes una lista de productos y quieres TODOS los que cuestan menos de 5000 para una sección de ofertas. ¿filter o find, y qué te devuelve?

Mini-reto

En "Mi Bolsillo" con un array de gastos: usa filter para obtener los gastos "hormiga" (menores a 5000) y muéstralos con su cantidad (.length). Usa find para encontrar el primer gasto que supere tu límite diario, y con findIndex su posición. Bonus: encadena filter y luego un map sobre el resultado (gastos.filter(...).map(...)) — los métodos se combinan en cadena, y eso es súper poderoso.

Qué sigue

Tienes map (transformar) y filter/find (seleccionar). Falta el tercer grande, el más temido y más poderoso: reduce, que ACUMULA toda una lista en un solo valor (un total, un promedio, un objeto resumen). La próxima lección lo desmitifica paso a paso — y completa tu trío esencial.