JavaScript-ben többféle módon szűrhetjük a tömbök tartalmát. Nézzük meg a leggyakoribb módszereket!
filter()
A filter()
metódus segítségével egy új tömböt hozhatunk létre azokkal az elemekkel, amelyek megfelelnek a megadott feltételnek. Ez egy tisztán funkcionális módszer.
1 2 3 |
const eredetiTomb = [1, 2, 3, 4, 5]; const szurtTomb = eredetiTomb.filter(elem => elem > 3); console.log(szurtTomb); // [4, 5] |
find()
A find()
metódus az első olyan elemet adja vissza, amely megfelel a feltételnek, nem az összeset.
1 2 3 |
const eredetiTomb = [1, 2, 3, 4, 5]; const elsoElem = eredetiTomb.find(elem => elem > 3); console.log(elsoElem); // 4 |
findIndex()
A findIndex()
metódus visszaadja annak az első elemnek az indexét, amely megfelel a feltételnek. Ha nincs találat, -1-et ad vissza.
1 2 3 |
const eredetiTomb = [1, 2, 3, 4, 5]; const index = eredetiTomb.findIndex(elem => elem > 3); console.log(index); // 3 (mivel a 4-es elem indexe 3) |
some() és every()
A some() metódus igaz értéket ad vissza, ha a tömb legalább egy eleme megfelel a feltételnek.
Az every() metódus akkor ad vissza igaz értéket, ha a tömb összes eleme megfelel a feltételnek.
1 2 3 4 5 6 |
const eredetiTomb = [1, 2, 3, 4, 5]; const vanNagyobbHaromnal = eredetiTomb.some(elem => elem > 3); console.log(vanNagyobbHaromnal); // true const mindNagyobbHaromnal = eredetiTomb.every(elem => elem > 3); console.log(mindNagyobbHaromnal); // false |
includes() + filter()
az includes() önmagában nem szűr, de gyakran használjuk más metódusokkal, például a filter()-rel együtt. Segítségével meghatározzuk, a tömb tartalmaz-e bizonyos értékeket vagy nem.
1 2 3 4 5 |
const eredetiTomb = ['alma', 'banán', 'cseresznye', 'dinnye']; const keresettElemek = ['banán', 'dinnye']; const szurtTomb = eredetiTomb.filter(elem => keresettElemek.includes(elem)); console.log(szurtTomb); // ['banán', 'dinnye'] |
map() + filter()
a map() elsősorban az elemek átalakítására szolgál, de kombinálva a filter()-rel komplex szűrési feltételek létrehozására is használható. pl: számoljuk ki az eredetiTomb értékeinek kétszeresét, majd gyűjtsük ki az ötnél nagyobb számokat!
1 2 3 4 5 6 7 |
const eredetiTomb = [1, 2, 3, 4, 5]; const szurtTomb = eredetiTomb .map(elem => elem * 2) .filter(elem => elem > 5); console.log(szurtTomb); // [6, 8, 10] |
slice(), splice()
slice() egy tömb egy részét kivágjuk bizonyos indexek alapján
splice() elemeket távolíthatunk el egy tömbből adott indexek alapján, és opcionálisan helyettesíthetjük őket más elemekkel.
1 2 3 4 5 6 7 |
const eredetiTomb = [1, 2, 3, 4, 5]; const szurtTomb = eredetiTomb.slice(1, 4); // 1. indextől a 4. indexig console.log(szurtTomb); // [2, 3, 4] const eredetiTomb = [1, 2, 3, 4, 5]; eredetiTomb.splice(2, 2); // 2. indexnél kezdve 2 elemet töröl console.log(eredetiTomb); // [1, 2, 5] |
flatMap()
A flatMap() metódus kombinálja a map() és a flat() műveleteket, és használható összetett szűrési és átalakítási feladatokra.
1 2 3 |
const eredetiTomb = [1, 2, 3, 4, 5]; const szurtTomb = eredetiTomb.flatMap(elem => elem > 3 ? [elem] : []); console.log(szurtTomb); // [4, 5] |
forEach()
, for() és manuális szűrés
A forEach()
és for() metódussal manuálisan is létrehozhatunk egy új tömböt, ahol minden elemet egy feltétel alapján vizsgálunk meg, és csak a megfelelő elemeket adjuk hozzá.
1 2 3 4 5 6 |
const eredetiTomb = [1, 2, 3, 4, 5]; let szurtTomb = []; eredetiTomb.forEach(elem => { if (elem > 3) szurtTomb.push(elem); }); console.log(szurtTomb); // [4, 5] |
1 2 3 4 5 6 7 8 |
const eredetiTomb = [1, 2, 3, 4, 5]; let szurtTomb = []; for (let i = 0; i < eredetiTomb.length; i++) { if (eredetiTomb[i] > 3) { szurtTomb.push(eredetiTomb[i]); } } console.log(szurtTomb); // [4, 5] |