Array JavaScript : Comprendere la funzione di ridurre

postato su da

Sintassi

arr.reduce(callbackFunction, [initialValue])

Ciò che riducono fare?

Ridurre è una funzione che scorre un array.

Le operazioni possono essere eseguite sul campo tramite una funzione callback.

Al termine delle operazioni sull'array, ridurre il rendimento di un singolo valore

Ridurre può essere utilizzato, per esempio, per un totale di un carrello della spesa

Esempio

  lasciate arr = [1,2,3,4,5];
  arr.reduce( (accumulatore, valore corrente, currentIndex, schieramento) => { 
      //alcune operazioni;
      restituire qualcosa;
  });

 

La funzione di callback

La funzione di callback viene richiamata per ogni elemento dell'array, passando 4 argomenti che vengono passati in dalla funzione di ridurre.

Queste 4 argomenti poi possono essere utilizzati nella nostra funzione di callback.

Prende quattro argomenti

  1. accumulatore – Il primo elemento della matrice sul primo loop o valore iniziale se fornita. Quindi il valore restituito del ciclo precedente.
  2. valore corrente – L'elemento corrente nella matrice. Inizia dal secondo elemento della matrice ie. arr[1], quando l'argomento iniziale valore non viene passato. Se l'argomento iniziale valore viene passato valore attuale inizia quindi dal primo elemento della matrice arr[0].
  3. currentIndex – L'indice dell'elemento corrente.
  4. schieramento – L'intero array.

Esempio di lavoro

lasciate arr = [1,2,3,4,5];

arr.reduce(
  (accumulatore, valore corrente, currentIndex, schieramento) => {
    console.log(`accumulatore (Il 1 ° ciclo, accumulatore è arr[0], allora è il valore restituito del ciclo precedente): ${accumulatore}`);
    console.log(`CurrentValue (Loop attraverso l'array, partendo arr[1]): ${valore corrente}`);
    console.log(`currentIndex: ${currentIndex}`);
    console.log(`matrice: ${schieramento}`);
    console.log('---');
    accumulatore di ritorno + valore corrente;
  }
);

Produzione

accumulatore (Il 1 ° ciclo, accumulatore è arr[0], allora è il valore restituito del ciclo precedente): 1
valore corrente (Loop attraverso l'array, partendo arr[1]): 2
currentIndex: 1
schieramento: 1,2,3,4,5
---
accumulatore (Il 1 ° ciclo, accumulatore è arr[0], allora è il valore restituito del ciclo precedente): 3
valore corrente (Loop attraverso l'array, partendo arr[1]): 3
currentIndex: 2
schieramento: 1,2,3,4,5
---
accumulatore (Il 1 ° ciclo, accumulatore è arr[0], allora è il valore restituito del ciclo precedente): 6
valore corrente (Loop attraverso l'array, partendo arr[1]): 4
currentIndex: 3
schieramento: 1,2,3,4,5
---
accumulatore (Il 1 ° ciclo, accumulatore è arr[0], allora è il valore restituito del ciclo precedente): 10
valore corrente (Loop attraverso l'array, partendo arr[1]): 5
currentIndex: 4
schieramento: 1,2,3,4,5
---

 

Fornire il valore iniziale

Specificando il secondo parametro (valore iniziale) nella funzione ridurre causerà initialValue da passare come argomento accumulatore sul primo loop.

Si noti che il valore di corrente al 1 ° ciclo inizia ora al primo elemento della matrice

Esempio di lavoro

  lasciate arr = [1,2,3,4,5];

  arr.reduce(
  (accumulatore, valore corrente, currentIndex, schieramento) => {
    console.log(`accumulatore ( Il 1 ° ciclo, questo è il valore iniziale, allora il valore restituito del ciclo precedente): ${accumulatore}`);
    console.log(`CurrentValue (Loop attraverso l'array, partendo arr[0]): ${valore corrente}`);
    console.log(`currentIndex: ${currentIndex}`);
    console.log(`matrice: ${schieramento}`);
    console.log('---');
    accumulatore di ritorno + valore corrente;
  }, 0
);

Produzione

accumulatore ( Il 1 ° ciclo, questo è il valore iniziale, allora il valore restituito del ciclo precedente): 0
valore corrente (Loop attraverso l'array, partendo arr[0]): 1
currentIndex: 0
schieramento: 1,2,3,4,5
---
accumulatore ( Il 1 ° ciclo, questo è il valore iniziale, allora il valore restituito del ciclo precedente): 1
valore corrente (Loop attraverso l'array, partendo arr[0]): 2
currentIndex: 1
schieramento: 1,2,3,4,5
---
accumulatore ( Il 1 ° ciclo, questo è il valore iniziale, allora il valore restituito del ciclo precedente): 3
valore corrente (Loop attraverso l'array, partendo arr[0]): 3
currentIndex: 2
schieramento: 1,2,3,4,5
---
accumulatore ( Il 1 ° ciclo, questo è il valore iniziale, allora il valore restituito del ciclo precedente): 6
valore corrente (Loop attraverso l'array, partendo arr[0]): 4
currentIndex: 3
schieramento: 1,2,3,4,5
---
accumulatore ( Il 1 ° ciclo, questo è il valore iniziale, allora il valore restituito del ciclo precedente): 10
valore corrente (Loop attraverso l'array, partendo arr[0]): 5
currentIndex: 4
schieramento: 1,2,3,4,5
---