JavaScript Ridurre i valori


Esempio

5.1

Il metodo reduce() applica una funzione contro un accumulatore e ogni valore dell'array (da sinistra a destra) per ridurlo a un valore singolo.

Somma matrice

Questo metodo può essere utilizzato per condensare tutti i valori di una matrice in un singolo valore:

[1, 2, 3, 4].reduce(function(a, b) {
  return a + b;
});
// → 10

Il secondo parametro facoltativo può essere passato a reduce() . Il suo valore sarà usato come primo argomento (specificato come a ) per la prima chiamata al callback (specificato come function(a, b) ).

[2].reduce(function(a, b) {
  console.log(a, b); // prints: 1 2
  return a + b;
}, 1);
// → 3

5.1

Appiattisci la matrice di oggetti

L'esempio seguente mostra come appiattire un array di oggetti in un singolo oggetto.

var array = [{
    key: 'one',
    value: 1
}, {
    key: 'two',
    value: 2
}, {
    key: 'three',
    value: 3
}];
5.1
array.reduce(function(obj, current) {
  obj[current.key] = current.value;
  return obj;
}, {});
6
array.reduce((obj, current) => Object.assign(obj, {
  [current.key]: current.value
}), {});
7
array.reduce((obj, current) => ({...obj, [current.key]: current.value}), {});

Si noti che le Proprietà di Riposo / Diffusione non sono nell'elenco delle proposte finite di ES2016 . Non è supportato da ES2016. Ma possiamo usare il plugin babel babel-plugin-transform-object-rest-spread per supportarlo.

Tutti gli esempi sopra riportati per Flatten Array si traducono in:

{
  one: 1,
  two: 2,
  three: 3
}

5.1

Mappa usando Riduci

Come altro esempio di utilizzo del parametro del valore iniziale , considerare l'attività di chiamare una funzione su una matrice di elementi, restituendo i risultati in una nuova matrice. Poiché gli array sono valori ordinari e la concatenazione di elenchi è una funzione ordinaria, possiamo utilizzare reduce per accumulare un elenco, come dimostra il seguente esempio:

function map(list, fn) {
  return list.reduce(function(newList, item) {
    return newList.concat(fn(item));
  }, []);
}

// Usage:
map([1, 2, 3], function(n) { return n * n; });
// → [1, 4, 9]

Nota che questo è solo per illustrazione (del parametro del valore iniziale), usa la map nativa per lavorare con le trasformazioni di lista (vedi Mappare i valori per i dettagli).


5.1

Trova il valore minimo o massimo

Possiamo usare l'accumulatore per tenere traccia di un elemento dell'array. Ecco un esempio sfruttando questo per trovare il valore minimo:

var arr = [4, 2, 1, -10, 9]

arr.reduce(function(a, b) {
  return a < b ? a : b
}, Infinity);
// → -10
6

Trova valori unici

Ecco un esempio che utilizza reduce per restituire i numeri univoci a un array. Un array vuoto viene passato come secondo argomento e viene referenziato da prev .

var arr = [1, 2, 1, 5, 9, 5];

arr.reduce((prev, number) => {
  if(prev.indexOf(number) === -1) {
    prev.push(number);
  }
  return prev;
}, []);
// → [1, 2, 5, 9]