Métodos comunes para recorrer arreglos en JavaScript

En JavaScript existen diferentes formas de recorrer un arreglo (array) para consultar sus elementos, transformarlos, filtrarlos o encontrar información específica.

Aunque varios métodos parecen similares, cada uno tiene un propósito diferente.

1. for: recorrer un arreglo con un contador

El ciclo for permite controlar manualmente cuántas veces se repite una operación y acceder a cada elemento mediante su índice.

const frutas = ["Manzana", "Pera", "Uva"];

for (let i = 0; i < frutas.length; i++) {
  console.log(frutas[i]);
}

Resultado:

Manzana
Pera
Uva

¿Cómo funciona?

• let i = 0: comienza en el índice 0.
• i < frutas.length: continúa mientras el índice sea menor que la longitud del arreglo.
• i++: incrementa el índice en cada repetición.
• frutas[i]: obtiene el elemento que se encuentra en ese índice.

¿Cuándo utilizarlo?

Cuando necesitas controlar el índice, modificar elementos por posición o recorrer el arreglo de una forma específica.

2. for...of: recorrer directamente los elementos

for...of permite recorrer los valores de un arreglo sin tener que manejar los índices manualmente.

const frutas = ["Manzana", "Pera", "Uva"];

for (const fruta of frutas) {
  console.log(fruta);
}

Resultado:

Manzana
Pera
Uva

En cada repetición, la variable fruta contiene el siguiente elemento del arreglo.

¿Cuándo utilizarlo?

Cuando solo necesitas obtener los valores y no te interesa conocer el índice de cada elemento.

3. forEach(): ejecutar una función por cada elemento

forEach() ejecuta una función una vez por cada elemento del arreglo.

const frutas = ["Manzana", "Pera", "Uva"];

frutas.forEach((fruta) => {
  console.log(fruta);
});

También puedes obtener el índice como segundo parámetro:

frutas.forEach((fruta, indice) => {
  console.log(`${indice}: ${fruta}`);
});

Resultado:

0: Manzana
1: Pera
2: Uva

¿Cuándo utilizarlo?

Cuando quieres realizar una acción por cada elemento, por ejemplo, mostrar información en consola o ejecutar una operación.

Importante: forEach() no devuelve un nuevo arreglo. Su resultado de retorno es undefined, por lo que no es el método adecuado si necesitas transformar y guardar los elementos.

4. map(): transformar los elementos

map() ejecuta una función por cada elemento y devuelve un nuevo arreglo con los resultados.

const numeros = [1, 2, 3, 4];

const duplicados = numeros.map((numero) => {
  return numero * 2;
});

console.log(duplicados);

Resultado:

[2, 4, 6, 8]

También puedes escribirlo de forma más corta:

const duplicados = numeros.map(numero => numero * 2);

Ejemplo con objetos

Supongamos que tienes una lista de productos y quieres obtener solamente sus nombres:

const productos = [
  { id: 1, nombre: "Llanta", precio: 25000 },
  { id: 2, nombre: "Aro", precio: 40000 },
  { id: 3, nombre: "Batería", precio: 35000 }
];

const nombres = productos.map(producto => producto.nombre);

console.log(nombres);

Resultado:

["Llanta", "Aro", "Batería"]

¿Cuándo utilizarlo?

Cuando necesitas transformar los elementos de un arreglo o extraer una propiedad de cada objeto.

5. filter(): seleccionar elementos que cumplen una condición

filter() devuelve un nuevo arreglo con los elementos que cumplen una condición.

const precios = [5000, 15000, 25000, 40000];

const preciosAltos = precios.filter(precio => precio > 20000);

console.log(preciosAltos);

Resultado:

[25000, 40000]

Ejemplo con objetos

const productos = [
  { nombre: "Llanta", precio: 25000 },
  { nombre: "Aro", precio: 40000 },
  { nombre: "Tapón", precio: 5000 }
];

const productosCaros = productos.filter(
  producto => producto.precio >= 25000
);

console.log(productosCaros);

Resultado: un arreglo con los objetos de la llanta y el aro.

¿Cuándo utilizarlo?

Cuando necesitas buscar varios elementos que cumplan un criterio, como productos disponibles, usuarios activos o precios dentro de un rango.

6. find(): encontrar el primer elemento que cumple una condición

find() devuelve el primer elemento que cumple una condición. Si ninguno coincide, devuelve undefined.

const numeros = [5, 12, 18, 25];

const encontrado = numeros.find(numero => numero > 15);

console.log(encontrado);

Resultado:

18

Ejemplo con objetos

const usuarios = [
  { id: 1, nombre: "Ana" },
  { id: 2, nombre: "Carlos" },
  { id: 3, nombre: "María" }
];

const usuario = usuarios.find(usuario => usuario.id === 2);

console.log(usuario);

Resultado:

{ id: 2, nombre: "Carlos" }

¿Cuándo utilizarlo?

Cuando buscas un único elemento, por ejemplo, el producto con un determinado ID.

7. some(): comprobar si al menos un elemento cumple una condición

some() devuelve true si al menos un elemento cumple la condición. Si ninguno la cumple, devuelve false.

const edades = [12, 15, 17, 22];

const hayAdultos = edades.some(edad => edad >= 18);

console.log(hayAdultos);

Resultado:

true

¿Cuándo utilizarlo?

Cuando solo necesitas comprobar si existe algún elemento que cumpla una condición, sin obtener el elemento en sí.

8. every(): comprobar si todos los elementos cumplen una condición

every() devuelve true únicamente cuando todos los elementos cumplen la condición.

const notas = [80, 90, 75, 95];

const todasAprobadas = notas.every(nota => nota >= 70);

console.log(todasAprobadas);

Resultado:

true

Si una nota fuera menor que 70, el resultado sería false.

¿Cuándo utilizarlo?

Cuando necesitas validar que todos los elementos cumplan una regla, por ejemplo, comprobar si todos los campos de un formulario están completos.

9. reduce(): acumular valores

reduce() recorre un arreglo y utiliza un acumulador para producir un único resultado, aunque ese resultado también puede ser un objeto u otro arreglo.

Ejemplo: sumar números

const precios = [1000, 2500, 3000];

const total = precios.reduce((acumulador, precio) => {
  return acumulador + precio;
}, 0);

console.log(total);

Resultado:

6500

El 0 es el valor inicial del acumulador.

En cada iteración:

1. El acumulador comienza en 0.
2. Se suma 1000, por lo que queda en 1000.
3. Se suma 2500, por lo que queda en 3500.
4. Se suma 3000, por lo que queda en 6500.

Ejemplo: calcular el total de una compra

const carrito = [
  { producto: "Llanta", precio: 25000, cantidad: 2 },
  { producto: "Aro", precio: 40000, cantidad: 1 }
];

const total = carrito.reduce((acumulador, item) => {
  return acumulador + item.precio * item.cantidad;
}, 0);

console.log(total);

Resultado:

90000

¿Cuándo utilizarlo?

Cuando necesitas calcular totales, contar elementos mediante un acumulador, agrupar información o construir un resultado a partir de varios elementos.

10. Comparación rápida

Método	¿Para qué sirve?	¿Qué devuelve?
for	Recorrer con control del índice.	No tiene un retorno automático útil.
for...of	Recorrer directamente los valores.	No tiene un retorno automático útil.
forEach()	Ejecutar una acción por elemento.	undefined.
map()	Transformar elementos.	Un nuevo arreglo.
filter()	Seleccionar elementos.	Un nuevo arreglo.
find()	Encontrar el primer elemento coincidente.	Un elemento o undefined.
some()	Comprobar si alguno cumple una condición.	Un booleano.
every()	Comprobar si todos cumplen una condición.	Un booleano.
reduce()	Acumular o combinar elementos.	El valor acumulado.

11. Diferencia entre map(), filter() y find()

Estos tres métodos son especialmente útiles al trabajar con datos provenientes de una API.

const productos = [
  { id: 1, nombre: "Llanta", precio: 25000 },
  { id: 2, nombre: "Aro", precio: 40000 },
  { id: 3, nombre: "Tapón", precio: 5000 }
];

// Transformar: obtener los nombres.
const nombres = productos.map(p => p.nombre);

// Filtrar: obtener productos que cuestan al menos 20000.
const caros = productos.filter(p => p.precio >= 20000);

// Encontrar: obtener el producto con ID 2.
const aro = productos.find(p => p.id === 2);

En resumen:

• map() cambia la representación de los datos.
• filter() selecciona varios elementos.
• find() busca un solo elemento.

12. Buenas prácticas

• Utiliza for...of cuando simplemente quieras recorrer los valores.
• Utiliza map() cuando necesites producir un arreglo transformado.
• Utiliza filter() para obtener los elementos que cumplen una condición.
• Utiliza find() para buscar un elemento específico.
• Utiliza some() y every() para validaciones.
• Utiliza reduce() cuando realmente necesites acumular o combinar resultados.
• Evita modificar el arreglo original dentro de map() o filter(). Lo habitual es utilizar sus resultados para crear nuevos datos.
• Recuerda que map(), filter(), find(), some(), every() y reduce() pueden detener el recorrido anticipadamente en ciertos casos (find(), some() y every() lo hacen cuando ya pueden determinar su resultado; map(), filter() y reduce() normalmente recorren todos los índices presentes).

Conclusión

No existe un único método que sea el mejor para todos los casos. La clave es elegirlo según el objetivo: recorrer, ejecutar una acción, transformar, filtrar, buscar, validar o acumular.