Filtro Javascript

| | | | | | | | | | | | | | | | | | | | | | | | |

Il metodo di filtro JavaScript() crea un array di elementi da un array esistente. Il metodo filter() accetta una funzione di callback come argomento. Questa funzione valuta se un elemento deve essere aggiunto al nuovo elenco da quello esistente.

Se non conosci JavaScript, potresti non aver sentito parlare delle funzioni filter() e reduce()Javascript. Queste funzioni possono essere utili quando si lavora con un elenco di oggetti, noto anche come array.

Se si desidera ottenere solo determinati valori da un array, è necessario può utilizzare la funzione filtro() JavaScript. In questo tutorial discuteremo, con riferimento agli esempi, come utilizzare la funzione filter().

Aggiornamento array

Un array JavaScript memorizza zero o più elementi. Gli elementi possono essere numeri, altri array, stringhe o utilizzare un altro tipo di dati. Usano indici numerati a partire da "0" per accedere a elementi specifici.

Gli array consentono di memorizzare più valori nella stessa variabile. Questo può aiutarti a scrivere meglio e in modo più pulito perché non hai bisogno di scrivere più variabili per memorizzare i tuoi valori.

Ecco un esempio di un array in JavaScript:

Matrice di filtri JavaScript

Il metodo JavaScript array filter() crea un nuovo array basato sul contenuto di un array esistente. Il metodo filter() valuta una funzione di callback su ogni elemento in un array esistente. Qualsiasi elemento che soddisfa la condizione nella funzione di callback viene aggiunto a un nuovo elenco.

Utilizzando il metodo filter, siamo in grado di recuperare valori che soddisfano determinati criteri e aggiungerli a un nuovo array.

Sintassi JavaScript array filtro

Il metodo filter utilizza la seguente sintassi:

Questo codice definisce un array chiamato "newArr" basato sul contenuto di l’array "oldArr". La nostra funzione di callback restituisce un valore al nuovo array se viene soddisfatta una condizione. Le condizioni di esempio includono:

Puoi usare gli operatori di confronto JavaScript per creare le tue condizioni. Oppure puoi usare un’istruzione if. Usando un if l’istruzione ti consente di controllare quale tra più valori viene aggiunto a un nuovo elenco.

Filtro JavaScript E xamples

Filtra un elenco di numeri

Cominciamo con un semplice esempio. Abbiamo un elenco di acquisti da una caffetteria. Vogliamo creare un nuovo elenco che mostri gli acquisti superiori a $ 10.

Il nostro elenco di acquisti ha questo aspetto:

Possiamo utilizzare il metodo filter() per recuperare gli acquisti di valore maggiore di $ 10:

Il nostro programma verifica se un acquisto vale più di $ 10. Un acquisto viene aggiunto al nostro elenco big_purchases se vale più di $ 10. In caso contrario, l’acquisto viene tralasciato.

Il valore della variabile JavaScript di big_purchases è:

Il metodo filter() restituisce tutti gli elementi che superano il test che abbiamo definito . Questo test è "elemento > 10". Se volessimo accedere a ogni acquisto, potremmo fare riferimento ai nostri "acquisti" originali elenco. Il nostro metodo filter() restituisce un array di valori maggiori di $10.

Filtra un array di oggetti

Abbiamo un array che contiene i nomi di tutti in una scuola:

E se volessimo recuperare solo gli studenti che sono in prima elementare? Filtro() semplifica l’esecuzione di questa operazione. Scriviamo una funzione che restituirà tutti i bambini di prima elementare dagli "studenti" array:

Filtro() accetta un parametro. Questa è una funzione che determina quale operazione esegui sui tuoi dati.

La funzione filter() esamina ogni oggetto nell’array "studenti". filter() restituisce gli studenti la cui classe è uguale a "Primo Grado." L’operatore "===" significa uguaglianza.

La funzione di filtro creerà un nuovo array con questi nuovi valori, accessibile tramite la variabile "firstGradeStudents".

< iframe width="100%" height="400px" frameborder="0" data-src="https://repl.it/@careerkarma/A-Guide-to-Filter-and-Reduce-in-JavaScript?lite =true" class="lazyload" src="data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==">

Conclusion

Puoi usare il metodo array filter() per creare un nuovo array dal contenuto di un array esistente indizio è nel nome con il metodo filter(). filter() filtra gli elementi da un array esistente.

E questo è tutto! Ora puoi usare reduce() in JavaScript con ancora più sicurezza. Per saperne di più su come codificare in JavaScript, leggi il nostro articolo sui migliori tutorial per principianti di JavaScript.