Javascript Array reduce ()

El método reduce () de JavaScript Array ejecuta una función reductora en cada elemento de la matriz y devuelve un único valor de salida.

La sintaxis del reduce()método es:

 arr.reduce(callback(accumulator, currentValue), initialValue)

Aquí, arr es una matriz.

reduce () Parámetros

El reduce()método incluye:

  • callback: la función que se ejecutará en cada elemento de la matriz (excepto el primer elemento si no se proporciona initialValue). Toma en
    • acumulador: acumula los valores de retorno de la devolución de llamada.
    • currentValue: el elemento actual que se pasa de la matriz.
  • initialValue (opcional): un valor al que se le pasará callback()en la primera llamada. Si no se proporciona, el primer elemento actúa como acumulador en la primera llamada y callback()no se ejecutará en él.

Nota: Llamar reduce()a una matriz vacía sin initialValue arrojará TypeError.

Valor de retorno de reduce ()

  • Devuelve el valor único resultante después de reducir la matriz.

Notas :

  • reduce() ejecuta la función dada para cada valor de izquierda a derecha.
  • reduce() no cambia la matriz original.
  • Casi siempre es más seguro proporcionarlo initialValue.

Ejemplo 1: Suma de todos los valores de la matriz

 const numbers = (1, 2, 3, 4, 5, 6); function sum_reducer(accumulator, currentValue) ( return accumulator + currentValue; ) let sum = numbers.reduce(sum_reducer); console.log(sum); // 21 // using arrow function let summation = numbers.reduce( (accumulator, currentValue) => accumulator + currentValue ); console.log(summation); // 21

Salida

 21 21

Ejemplo 2: Restar números en una matriz

 const numbers = (1800, 50, 300, 20, 100); // subtract all numbers from first number // since 1st element is called as accumulator rather than currentValue // 1800 - 50 - 300 - 20 - 100 let difference = numbers.reduce( (accumulator, currentValue) => accumulator - currentValue ); console.log(difference); // 1330 const expenses = (1800, 2000, 3000, 5000, 500); const salary = 15000; // function that subtracts all array elements from given number // 15000 - 1800 - 2000 - 3000 - 5000 - 500 let remaining = expenses.reduce( (accumulator, currentValue) => accumulator - currentValue, salary ); console.log(remaining); // 2700

Salida

 1330 2700

Este ejemplo explica claramente la diferencia entre pasar un initialValue y no pasar un initialValue.

Ejemplo 3: eliminar elementos duplicados de la matriz

 let ageGroup = (18, 21, 1, 1, 51, 18, 21, 5, 18, 7, 10); let uniqueAgeGroup = ageGroup.reduce(function (accumulator, currentValue) ( if (accumulator.indexOf(currentValue) === -1) ( accumulator.push(currentValue); ) return accumulator; ), ()); console.log(uniqueAgeGroup); // ( 18, 21, 1, 51, 5, 7, 10 )

Salida

 (18, 21, 1, 51, 5, 7, 10)

Ejemplo 4: Agrupar objetos por una propiedad

 let people = ( ( name: "John", age: 21 ), ( name: "Oliver", age: 55 ), ( name: "Michael", age: 55 ), ( name: "Dwight", age: 19 ), ( name: "Oscar", age: 21 ), ( name: "Kevin", age: 55 ), ); function groupBy(objectArray, property) ( return objectArray.reduce(function (accumulator, currentObject) ( let key = currentObject(property); if (!accumulator(key)) ( accumulator(key) = (); ) accumulator(key).push(currentObject); return accumulator; ), ()); ) let groupedPeople = groupBy(people, "age"); console.log(groupedPeople);

Salida

 ('19': ((nombre: 'Dwight', edad: 19)), '21': ((nombre: 'John', edad: 21), (nombre: 'Oscar', edad: 21)), ' 55 ': ((nombre:' Oliver ', edad: 55), (nombre:' Michael ', edad: 55), (nombre:' Kevin ', edad: 55)))

Lectura recomendada: JavaScript Array reduceRight ()

Articulos interesantes...