JavaScript Filter Map Reduce

Yazılım dünyasında sıkça liste ve dizilerle uğraşmaktayız. Bunları filtreliyoruz, içerisindeki değerleri başka bir değere dönüştürüyoruz ya da değerlerin toplamını alıyoruz. Yıllardır bunları for döngüsü ile gezerek yapıyoruz.

2011 yılında JavaScript; map , reduce ve filter fonksiyonlarını duyurdu. Bunlar sayesinde daha okunabilir ve karmaşıklığı düşük kodlar yazabiliyoruz.

Bu yazıda bu üç fonksiyonun kullanımlarını gösterip örnekler üzerinde açıklayacağım.

Filter

Filter vs for

JS Bin

Yukarıdaki örneği inceleyelim. tekilDegerleriBul() fonksiyonunda 0–9 aralığında rastgele 1.000.000 sayı ile doldurulmuş olan geciciDizi dizisini for ile dönüyoruz. indexOf() (aynı elemandan birden fazla varsa ilk görüldüğü sırayı döndürür) fonksiyonunu kullanarak sıradaki sayının dizideki sırasını buluyoruz. i değişkeninine bunun eşitliğini kontrol ederek ilk defa görülüp görülmediğini kontrol ederek ilk defa görülüyorsa filtreliDizi isimli değişkene bu elemanı koyuyoruz. Böylece sadece tekil değerleri filtreliDizi isimli dizide toplamış oluyoruz.

tekilDegerleriFiltreIlBul() fonksiyonunda aynı işlemi filter() fonksiyonu kullanarak gerçekleştirdik.

filter() fonksiyonu dizideki herbir eleman için içerisine yazılan callback fonksiyonunu çağırır. Bu fonksiyonu çağırırken de birinci parametre olarak sıradaki elemanı (elem), ikinci parametre olarak geçerli sıra numarasını (i), üçüncü parametre olarak da dizinin kendisini (dizi ) verir. filter() , callback fonksiyonunun true değerini döndürdüğü elemanları bir dizi olarak geri döndürür.

Map

JS Bin

Yukarıdaki örnekte ise map fonksiyonunu örnekledim. Yine elimizde bir dizi var ve içerisini rastgele 0–100 aralığında 100 adet sayı ile dolduralım. Bu sayıların kalori olduğunu farzedelim ve bunları jul tipine çevirmek istediğimizi farzedelim. kaloridenJuleCevir() fonksiyonunda for döngüsü ile herbir elemanı kaloridenJule() fonksiyonunu çağırarak sonucu yeni bir diziye atıyoruz ve bu diziyi döngü bitince döndürüyoruz. Geleneksel yöntem.

kaloridenJuleMapIleCevir() fonksiyonunda ise aynı işlevi map() kullanarak gerçekleştirelim.

map() fonksiyonu filter() fonksiyonunda olduğu gibi herbir element için bir callback fonksiyonu çağırır ve aynı parametreleri geçirir. Callback fonksiyonu tarafından döndürülen değerleri bir dizide biriktirir ve sonuç olarak bu diziyi döndürür.

Reduce

Reduce fonksiyonu da diğerleri gibi her bir eleman için callback fonksiyonunu çağırıyor. Diğerlerinden farklı olarak callback fonksiyonunda 4 parametre var. İlk parametre geçerli elemandan önceki elemanların toplamını veriyor. Bu parametre bir dizideki elemanların toplamını bulacaksanız işinizi kolaylaştırıyor. Diğer parametreler sırasıyla filter fonksiyonu ile aynı. Ayrıca dizi dizilerini de kolaylıkla nesne/ilkel tip dizilerine çevirebilirsiniz.

Neden Map Reduce ve Filter Kullanalım?

• for döngüsünü yönetmenize gerek kalmaz.
• Bir elemana erişmek için index dizi[i] kullanmak yerine doğrudan callback fonksiyonundaki parametreyi kullanırsınız.
• Sonucu biriktirmek için yeni bir dizi oluşturup elemanları içerisine yerleştirmeye ihtiyaç duymazsınız.
• Bu fonksiyonları zincir olarak kullanabilirsiniz. ( dizi.filter(…).map(…) gibi)

For döngüsü ile bu fonksiyonların performans kıyaslamalarına da değinecektim fakat performans konusu tarayıcı bağımlı olduğundan onu sonraki bir yazıya bırakmaya karar verdim.