Come utilizzare la funzione di riduzione dell'array JavaScript
In questo post, afferreremo il concetto di JavaScript ridurre() funzione. Cos'è un ridurre() funzione e come possiamo usarlo per aiutare a semplificare il codice JavaScript e completare le attività in modo efficiente e più rapido.
Qual è la riduzione() funzione?
Javascript's ridurre() La funzione per l'array viene utilizzata per ridurre l'array in un singolo valore di uscita.
IL ridurre() La funzione prende l'elemento di un array uno per uno, esegue un'operazione e restituisce un singolo valore di uscita. Esploriamo e scaviamo di più per capire la sintassi e la sua funzionalità, insieme a un paio di esempi.
Sintassi:
vettore.Ridurre (function_name, inizialeValue);La parte interessante della funzione di riduzione () dell'array è che può prendere una funzione di callback con quattro argomenti. La sintassi della funzione di callback e la sequenza di argomenti andranno così:
funzione function_name (accumulator, valore, indice, array)..
Nella funzione richiamata di Riducing () metodo:
- Il primo parametro è un accumulatore che memorizza il risultato dopo ogni iterazione.
- Il secondo parametro/argomento contiene il valore dell'elemento di array corrente durante l'iterazione.
- Il terzo parametro è il parametro opzionale che è la corrente indice dell'elemento array durante l'iterazione.
- Infine, possiamo anche superare il vettore stesso alla funzione di callback per avere alcune funzionalità personalizzate all'interno della funzione di callback.
Possiamo anche passare il valore iniziale alla funzione. Il valore iniziale sarà il valore iniziale dell'accumulatore.
Proviamo un paio di esempi per vedere le sue implementazioni
Nota: Useremo la console del browser per dimostrare esempi eseguiti in questo post. Per aprire la console del browser:
- Usa il F12 Chiave in Chrome e in altri browser a base di cromo.
- Utilizzo Ctrl + shift + k tasti di scorciatoia da tastiera per mozilla.
- Utilizzo Opzione + ⌘ + C tasti di scelta rapida della tastiera in safari (se non viene visualizzato il menu degli sviluppatori, quindi apri le preferenze premendo ⌘ +, e in Avanzate Controllo della scheda "Mostra il menu Sviluppa nella barra dei menu").
Come utilizzare la funzione di riduzione () in javascript
Il miglior esempio per capire il ridurre() La funzione è l'aggiunta di numeri memorizzati negli elementi dell'array.
Esempio 1:
Supponiamo di avere una serie di numeri e vogliamo aggiungere tutti questi numeri:
Numeri var = [23,76,38,55,10]Il primo modo per aggiungere questi numeri è usare a per ciclo continuo:
var sum = 0;per (leti = 0; i
console.registro (somma);
Sebbene abbiamo ottenuto la somma come output, perché non utilizzare un modo intelligente e semplice per eseguire lo stesso calcolo utilizzando il ridurre() Metodo dell'array, in cui non dobbiamo mutare le variabili come "somma."
Utilizzando la funzione di riduzione ():
IL ridurre() funzione per calcolare la somma andrà così:
var sum = numeri.ridurre (addnumbers, 0);funzione addNumbers (totale, num)
Restituzione totale + num
console.registro (somma);
Nel codice sopra, puoi vedere che abbiamo superato per la prima volta il Addnumbers funzione a ridurre() funzione e in Addnumbers Definizione della funzione, abbiamo appena aggiunto ogni numero alla variabile dell'accumulatore totale e ha restituito il suo valore.
Una volta il ridurre() La funzione aggiunge tutti i numeri in numeri Array, memorizzerà il risultato finale in somma variabile.
Infine, abbiamo appena consolato il somma variabile per verificare se il nostro ridurre() La funzione ha funzionato bene o no.
Guardando nello screenshot fornito sopra, è possibile verificare che la funzione di riduzione () abbia aggiunto tutti i numeri e mostrato il risultato nella console, che è 202 e perfettamente calcolato.
Un altro modo più corto e più semplice per scrivere ridurre() La funzione è rendere la funzione di callback una funzione freccia:
La sintassi di scrivere la funzione di callback all'interno del ridurre() Le parentesi della funzione saranno così:
var sum = numeri.ridotta ((totale, num) =>Restituzione totale + num
, 0);
console.registro (somma);
Va bene, questo è stato il semplice esempio in cui abbiamo solo una serie di numeri; Che dire della matrice di oggetti. Proviamo anche quello.
Esempio 2:
Supponiamo di avere un elenco di studenti in un array e vogliamo calcolare le commissioni totali di tutti gli studenti:
VAR Students = [ID: 1,
Nome: "John"
Età: 12,
Commissione: 8500
,
ID: 2,
Nome: "Bob",
Età: 14,
Commissione: 9000
,
ID: 3,
Nome: "Steve",
Età: 10,
Commissione: 8000
,
"
IL ridurre() funzione per calcolare le commissioni totali andranno così:
var totalfees = studenti.ridotta ((totale, studente) =>Restituzione totale + studente.tassa
, 0);
console.log (totalfees);
Ora, l'unica differenza in questo codice è che un singolo oggetto viene passato come valore alla funzione di callback e all'interno della definizione della funzione di callback, abbiamo accettato la commissione e aggiunto alla variabile dell'accumulatore.
Guardando lo screenshot allegato sopra, puoi vedere che le commissioni degli studenti vengono aggiunte e visualizzate come output. Quindi è così che possiamo accedere agli oggetti di un array in ridurre() funzione.
Conclusione:
In questo post, abbiamo imparato cosa ridurre() La funzione è e come possiamo usarla per aiutare a semplificare il codice JavaScript e completare le attività in modo efficiente e rapido.
Abbiamo imparato che il ridurre() La funzione riduce l'array in un singolo valore di output. IL ridurre() La funzione prende una funzione di callback applicata a ogni elemento dell'array e restituisce un singolo valore di output.
Questo post è tutto su JavaScript ridurre() funzione e il suo utilizzo. Contiene alcuni esempi di base che aiutano a comprendere il ridurre() funzione.