Búsqueda de elementos con find() y findIndex()

Clase 57 de 80Curso de JavaScript Desde Cero

Contenido del curso

Primeros Pasos

Funciones y This

Resumen

Cuando trabajas con arrays en JavaScript, una necesidad frecuente es localizar un elemento específico o su posición sin alterar el array original. Para esto existen dos métodos fundamentales que funcionan de forma similar pero devuelven resultados distintos: find y findIndex. Ambos reciben una función con una condición y recorren el array hasta encontrar el primer elemento que la cumpla.

¿Cómo funciona el método find en JavaScript?

El método find recorre un array y devuelve el primer elemento que satisfaga la condición definida dentro de la función que le pasamos como argumento [0:24]. Es importante destacar que este método no modifica el array original, lo cual lo convierte en una opción segura cuando necesitas buscar sin efectos secundarios.

Por ejemplo, dado un array de múltiplos de cinco:

javascript const multiplesOfFive = [5, 10, 15, 20];

const firstNumberGreaterThanTen = multiplesOfFive.find(number => number > 10);

console.log(multiplesOfFive); // [5, 10, 15, 20] console.log(firstNumberGreaterThanTen); // 15

  • El array permanece intacto: [5, 10, 15, 20].
  • El resultado es 15, que es el primer valor mayor a diez [1:08].

Si ningún elemento cumple la condición, find devuelve undefined. Esto es útil para validar existencia antes de operar con el resultado.

¿Qué hace findIndex y en qué se diferencia de find?

Mientras find devuelve el valor del elemento, findIndex devuelve el índice (la posición) del primer elemento que cumpla con la condición [1:30]. Si no encuentra ninguno, retorna -1.

javascript const randomNumbers = [6, 14, 27, 56, 40];

const indexOfNumber = randomNumbers.findIndex(number => number > 50);

console.log(randomNumbers); // [6, 14, 27, 56, 40] console.log(indexOfNumber); // 3

  • El array original no se modifica.
  • El primer número mayor a cincuenta es 56, ubicado en el índice 3 (posiciones: 0, 1, 2, 3) [2:22].

¿Cuándo usar find y cuándo findIndex?

  • Usa find cuando necesitas trabajar directamente con el valor encontrado.
  • Usa findIndex cuando lo que importa es la posición del elemento, por ejemplo, para luego usar ese índice con splice u otro método.

¿Qué tienen en común ambos métodos?

  • Ninguno muta el array original.
  • Ambos aceptan una callback function con la condición de búsqueda.
  • Ambos se detienen en el primer elemento que cumpla la condición, lo que los hace eficientes al no recorrer el array completo innecesariamente.

¿Cómo se ejecutan estos métodos en la terminal?

Para probar ambos métodos, basta con crear un archivo JavaScript y ejecutarlo con Node.js [1:15]:

bash node clase-find-findIndex.js

Al correrlo, la consola imprime primero el array sin cambios y luego el resultado de cada método, confirmando que la inmutabilidad se mantiene en ambos casos.

Estos dos métodos son herramientas esenciales para la manipulación de datos en JavaScript. Dominarlos te permite escribir código más limpio y predecible al buscar dentro de colecciones. ¿Ya los has usado en algún proyecto? Comparte tu experiencia en los comentarios.