JavaScript'te filter Fonksiyonu Kullanımı

Sezai AlkanFrontend Developer

JavaScript #javascript #filter #function

JavaScript'te filter fonksiyonu, bir dizi üzerinde belirli bir koşulu sağlayan elemanları seçmek ve yeni bir dizi oluşturmak için kullanılan bir araçtır. Bu fonksiyon, dizi elemanlarını döngü ile tek tek kontrol etme ihtiyacını ortadan kaldırarak kodunuzu daha temiz ve okunabilir hale getirir.
 

Kullanımı

filter fonksiyonu, iki parametre alır, birincisi her eleman üzerinde uygulanacak olan bir koşul fonksiyonu, ikincisi ise bu koşulu sağlayan elemanları içeren yeni bir dizi oluşturan fonksiyonudur.

const arr = [1, 2, 3, 4, 5, 6];

const filtered = arr.filter(item => {
    return item > 2;
});

console.log(filtered);

// Output: [3, 4, 5, 6] 

Yukarıdaki örnekte, filter fonksiyonu, her elemanı kontrol edip elemanın 2'ten büyük olup olmadığını kontrol eder. Koşulu sağlayan elemanlar, filtered adlı yeni bir diziye eklenir.
 

Okunabilirlik ve Arrow Fonksiyonları

Yukarıdaki örneği okunabilirliği artırmak için arrow fonksiyonları ile yazabiliriz

const arr = [1, 2, 3, 4, 5, 6];

const filtered = arr.filter(item => item > 4);

console.log(filtered); 

// Output: [5, 6]

String Elemanları Filtreleme

filter fonksiyonu, sadece sayıları değil, aynı zamanda dizideki string elemanları da filtrelemek için kullanılabilir

const searchTerm = 'hmet';
const arr = [
    { name: "Ahmet", age: 25 },
    { name: "Ayşe", age: 30 },
    { name: "Mehmet", age: 22 }
];

const result = arr.filter(item => item.name.toLowerCase().includes(searchTerm.toLowerCase()));

console.log(result); 

// Output: [{ name: "Ahmet", age: 25 }, { name: "Mehmet", age: 22 }]

Bu örnekte, dizi içerisindeki name değerlerinde arama işlemi yaptık ara işleminde eşleşen değeler ile birlikte bize yeni bir dizi oluşturmaktadır.
 

Özel Koşul Fonksiyonunu Kullanma

filter fonksiyonu, kendi özel koşul fonksiyonlarınızı da kullanmanıza olanak tanır. Örneğin, tek sayıları filtrelemek için bir özel fonksiyon kullanalım

const custom = (number) => {
    return number % 2 !== 0;
}

const arr = [1, 2, 3, 4, 5, 6];

const oddNumber = arr.filter(custom);

console.log(oddNumber); 

// Output: [1, 3, 5]

Bu örnekte, custom fonksiyonu, bir sayının tek olup olmadığını kontrol eder ve bu fonksiyonu filter ile birlikte kullanarak dizideki tek sayıları seçer.

filter fonksiyonu, JavaScript'te veri manipülasyonu yaparken çok güçlü ve kullanışlı bir araçtır. İster basit sayı dizileriyle çalışın, ister karmaşık nesne dizileriyle, filter fonksiyonu sayesinde koşulları karşılayan elemanları kolayca seçebilirsiniz.