
A filter() JavaScript függvény is hasonlít a map() függvényre annyiban, hogy paraméterként kap egy függvényt, ami szépen bejár egy tömböt, a végtermék pedig egy teljesen új tömb lesz.
Pontosan azt csinálja, amire a név is utal, azaz (meg)szűri egy tömb elemeit.
Így működik a filter (példával)
Kiindulásként adott egy tömb, ami 1-től 8-ig tartalmaz számokat:
const tomb = [1, 2, 3, 4, 5, 6, 7, 8];
Azt szeretném elérni, hogy kapjak egy olyan tömböt, ami csak a páros számokat tartalmazza, mert párosan szép az élet :).
Létrehozok az eredménynek egy új változót. Ez a változó tárolja majd szűrő eredményét.
const eredmeny =
Ezután meg is hívom a tömbnek a filter függvényét, aminek paraméterként megadtam egy függvényt, méghozzá olyan jó kis nyilasat. A nyíl függvény első paramétere mindig az aktuális tömbelem.
const eredmeny = tomb.filter(aktualisElem =>
Aztán, amivel a nyíl másik oldalán visszatérünk, az tulajdonképpen egy logikai igaz vagy hamis érték. Ugyanis azt szeretném minden lépésben vizsgálni, hogy az éppen aktuális elem az páros-e. Ennek a vizsgálatnak az eredménye vagy az lesz, hogy igen páros, tehát true, vagy pedig az, hogy nem páros, azaz false.
Ha true a feltétel eredménye, akkor a filter visszaadja az elemet. És hozzáteszem gyorsan azt is, hogy a színfalak mögött, bele is írja az új tömbbe. Hiszen, ahogy írtam, a végén majd egy teljesen új tömböt kapunk eredményül, ami példánkban az eredmeny változóban tárolódik. Aztán persze ott az érem másik oldala is. Ha false a feltétel eredménye, akkor nem ad vissza elemet a filter az adott lépésben.
Azt pedig, hogy páros-e egy szám, azt úgy tudom vizsgálni, hogy maradékos osztást végzek. Azaz elosztom az elemet kettővel. És abban az esetben, ha a maradék nulla, akkor páros számról van szó. Ha a nullától eltérő az eredmény, akkor pedig páratlan számról. A maradékos osztásra JavaScriptben a % jelet használjuk. Úgy is hívják ezt, hogy modulo operátor.
Így néz ki a feltétel:
const eredmeny = tomb.filter(aktualisElem => (aktualisElem % 2) === 0);
És ennyi
Gyakorlatilag ezzel készen is van, amit akartam. Konzolba akár ki is lehet íratni a régi és az új tömböt:
console.log(`Eredeti tömb = ${tomb}, eredmény = ${eredmeny}`);
További paraméterek
Nem tudok elköszönni anélkül, hogy meg ne említeném, hogy a filteren belül használt nyíl függvény paraméterezése teljesen megegyezik a map() függvénynél beszéltekkel:
- Az első paraméter kötelezően megadandó. Ez az aktuálisan feldolgozandó tömb elem.
- A második paraméter megadása nem kötelező. Ez az aktuális elem indexét jelenti.
- A harmadik paraméter, ami szintén opcionális, az maga az eredeti tömb.
Működő példa
Készítettem egy példát online is. Ide kattintva lehet kipróbálni. (Mivel a repl.it egy angol nyelvű weboldal, az ottani példában angolul neveztem el a változókat.)