Arreglos - Métodos de iteración

Generated avatar
javascript métodos iteración

Tabla de contenido

Cuando trabajamos con Array en JavaScript, hay casos en los que debemos recorrerlos para aplicar operaciones sobre sus elementos.

Resumen

MétodoDescripciónUso principalDevuelve
forEach()Ejecuta una función por cada elemento del arreglo.Realizar acciones sobre cada elemento.undefined
map()Crea un nuevo arreglo aplicando una función a cada elemento del original.Procesar elementos del arreglo.Un nuevo arreglo con los valores transformados.
reduce()Reduce todos los elementos del arreglo a un único valor aplicando una función acumuladora.Acumular valores, como suma, concatenación, etc.El valor acumulado.

forEach()

Nos ayuda a ejecutar una función para cada elemento del arreglo.

const miFuncion = (elemento, indice, arreglo) => {
  //...
};


miArreglo.forEach(miFuncion);
  • elemento: El elemento actual que se está procesando.
  • indice: El índice del elemento actual (opcional).
  • arreglo: El arreglo original (opcional).

Ejemplo

const numeros = [1, 2, 3, 4];
const imprimir = (numero) => {
  console.log(numero);
};


numeros.forEach(imprimir);

Terminal window
1
2
3
4

map()

Nos ayuda a crear un nuevo arreglo aplicando una función a cada elemento del arreglo original.

Por lo tanto la función debe devolver un valor que será insertado en el nuevo arreglo.

Ideal cuando queremos tener valores procesados y preservar los valores del original, es decir, tener dos arreglos.

Sintaxis

const miFuncion = (elemento, indice, arreglo) => {
  //...
};


miArreglo.map(miFuncion);
  • elemento: El elemento actual que se está procesando.
  • indice: El índice del elemento actual (opcional).
  • arreglo: El arreglo original (opcional).

Ejemplo

const numeros = [1, 2, 3, 4];
const duplicar = (num) => num * 2;


const resultado = numeros.map(duplicar);
console.log(numeros);
console.log(resultado);

Terminal window
[1, 2, 3, 4]
[2, 4, 6, 8]

reduce()

Toma cada elemento de un arreglo hasta reducirlos a un único valor acumulado.

Es poderoso para operaciones como sumar, concatenar o combinar elementos.

Sintaxis

const valorInicial = 0;
const miReductor = (acumulador, elemento, indice, arreglo) => {
  //...
};


miArreglo.reduce(miReductor, valorInicial);
  • acumulador: La variable que guarda el resultado acumulado.
  • elemento: El elemento actual que se está procesando.
  • indice: El índice del elemento actual (opcional).
  • arreglo: El arreglo original (opcional).
  • valorInicial: El valor inicial del acumulador (opcional).

Ejemplo

const valorInicial = 0;
const numbers = [1, 2, 3, 4];
const sumatoria = (acc, num) => acc + num;


const resultado = numbers.reduce(sumatoria, valorInicial);
console.log(resultado);

Comentarios

Compartir

Esta artículo aparece en estas rutas de aprendizaje

Dominando conceptos: Arreglos

Aprende a trabajar con arreglos, desde los fundamentos hasta las técnicas avanzadas, una de las estructuras de datos más esenciales en JavaScript.

Generated avatar
DEV