Cómo verificar si un elemento está en un array JS: guía de velocidad

¿Cómo verificar si un elemento está en un array de JavaScript? De «solo funciona» a «vuela»

¿Alguna vez ha escrito código y de repente se ha quedado paralizado mirando un array de datos? «¿Está aquí lo que necesito?» — esta pregunta atormenta a todo desarrollador. En Stack Overflow, el tema How do I check if an array includes a value in JavaScript ha acumulado millones de visitas. Y con razón. Aparentemente una tarea trivial, pero de su solución depende no solo la legibilidad del código, sino también la velocidad de toda la aplicación.

Hoy analizaremos todas las formas de verificar la presencia de un elemento en un array de JavaScript. No solo mostraremos los métodos, realizaremos una verdadera investigación de rendimiento. Aprenderá cuándo usar includes(), por qué indexOf() a veces es más rápido y cómo Set puede acelerar su código decenas de veces. ¡Allá vamos!

El clásico del género: Array.prototype.includes()

La forma más moderna y legible es el método includes(). Apareció en ES2016 y rápidamente se convirtió en el estándar de facto. ¿Por qué? Porque su nombre lo dice todo.

const fruits = ['apple', 'banana', 'mango', 'orange'];\nconst hasBanana = fruits.includes('banana');\nconsole.log(hasBanana); // true\n\nconst hasGrape = fruits.includes('grape');\nconsole.log(hasGrape); // false\n

Todo es simple y elegante. includes() usa comparación estricta (===), así que tenga cuidado con los tipos de datos:

const numbers = [1, 2, 3];\nconsole.log(numbers.includes('1')); // false — el string no es igual al número\n

Ventajas:

\n
• Legibilidad 10/10 — el código es comprensible incluso para un principiante
\n
• Funciona con NaN (a diferencia de indexOf)
\n
• Compatible con todos los navegadores modernos
\n

Desventajas:

\n
• Complejidad lineal O(n) — recorre todo el array
\n
• No es adecuado si necesita encontrar el índice del elemento
\n

El veterano: Array.prototype.indexOf()

Antes de la aparición de includes(), todos usaban indexOf(). Este método devuelve el índice del primer elemento encontrado o -1 si el elemento está ausente.

const fruits = ['apple', 'banana', 'mango'];\nconst index = fruits.indexOf('banana');\nif (index !== -1) {\n  console.log('Elemento encontrado en la posición', index);\n} else {\n  console.log('Elemento no encontrado');\n}\n

Muchos están acostumbrados a esta verificación, y sigue funcionando. Pero hay un matiz importante: indexOf() no puede encontrar NaN.

const arr = [NaN];\nconsole.log(arr.indexOf(NaN)); // -1 — ¡no lo encuentra!\nconsole.log(arr.includes(NaN)); // true — lo encuentra\n

Esto se debe a que NaN !== NaN en JavaScript, e indexOf usa comparación estricta. includes(), en cambio, usa el algoritmo SameValueZero, que maneja correctamente NaN.

¿Cuándo usar indexOf?

\n
• Si necesita el índice del elemento, no solo el hecho de su presencia
\n
• Si está seguro de que no hay NaN en el array
\n
• En código heredado donde no se puede usar ES2016+
\n

El luchador flexible: Array.prototype.find() y findIndex()

Cuando necesita verificar no solo la presencia, sino el cumplimiento de una condición, find() viene al rescate. Acepta una función callback y devuelve el primer elemento que cumple la condición, o undefined.

const users = [\n  { id: 1, name: 'Alice', age: 25 },\n  { id: 2, name: 'Bob', age: 30 },\n  { id: 3, name: 'Charlie', age: 35 }\n];\n\nconst user = users.find(u => u.age > 28);\nconsole.log(user); // { id: 2, name: 'Bob', age: 30 }\n\n// Verificación de existencia\nconst exists = users.find(u => u.id === 4) !== undefined;\nconsole.log(exists); // false