"Enter"a basıp içeriğe geçin

Javascript Filter Metodu

Bir önceki yazımızda Javascript’te Map Metodundan bahsetmiştim. Bu yazıda yine diziler ile birlikte kullanabileceğimiz güzel bir metoddan bahsedeceğim. Bu metodumuzu kullanarak diziler içerisinde belirli kriterlere uyan elemanları elde edebiliyoruz.

Burada dikkat etmeniz gereken bir mesele var: Filter metodu dizinin üzerinde oynama yapmaz. Geriye yeni bir dizi döndürür. Şimdi hemen şöyle bir örnek yapalım: Programımız, dizinin içerisindeki 23’ten büyük sayıları döndürsün. Örnek olarak bir önceki yazımızdaki sayılar dizisini aynen kullanabiliriz.

var numbers = [15, 24, 53, 8, 16, 2, 35];

Filter metodumuzun kullanımı neredeyse map metodumuz ile aynı. dizi.filter yazdıktan sonra bir callback çağırıyoruz, parametre olarak dizi elemanımızı alıyor. Daha sonra bu fonksiyonun içerisinde true veya false değerlerinden birini döndürüyoruz. Eğer true döndürürsek yeni oluşan dizi içerisine bu değerimiz eklenir, eğer false döndürürsek yeni dizi içerisine eklenmez. Bu bilgiyi öğrendiğimize göre şunu söyleyebiliriz, 23’ten büyük olan sayıları elde etmek istiyorsak sadece sayının 23’ten büyük olup olmama durumunu döndürmemiz yeterlidir. Daha farklı bir dille söylemek gerekirse döndürmemiz gereken şey “sayi > 23” koşuludur. Bu koşulu döndürdüğümüzde eğer sayımız 23’ten büyükse true döndürecek ve bu sayıyı yeni dizimizin içerisine alacaktır. 23’ten küçükse false dönecektir ve bu sayı da yeni dizimiz içerisinde alınmayacaktır. Böyle havada kalmasın bu, kodumuzu yazalım ve görelim ki daha iyi anlayalım.

var numbers = [15, 24, 53, 8, 16, 2, 35];
var numbersBiggerThen20 = numbers.filter(function(number) {
  return number > 23;
});
console.log(numbersBiggerThen20);

numbers.filter dedikten sonra parametre olarak bir callback verdik. Bu callback içerisine bir parametre aldı. Bu parametrenin adına number dedik. Zaten isminden az çok anlaşılıyor ne olduğu ama yine de anlatalım. Filter metodunu çalıştırdığımız zaman bu dizi bir çeşit döngüye giriyor. Buradaki parametremiz de o anda üzerinde işlem yapılan dizi elemanımızın değeri oluyor.

İnşallah yeteri kadar açık ve anlaşılır olmuştur. Temel olarak filter özelliğini bu şekilde kullanabilirsiniz. Şimdi bonus kısma geçelim. Bir önceki yazıda biraz değindiğimiz arrow functions meselesine burada da değineceğiz.

Yukarıdaki kodumuzu arrow function şeklinde yazalım.

var numbers = [15, 24, 53, 8, 16, 2, 35];
var numbersBiggerThen20 = numbers.filter((number) => number > 23);
console.log(numbersBiggerThen20);

Kodu bu şekilde yazdığınızda yine aynı sonucu verecektir.

Bu yazış şekline arrow function deniyor. MDN’de bu konuyu anlatan çok güzel bir içerik var. Konu hakkında daha fazla bilgi almak isteyen olursa inceleyebilir. Onun linkini buraya bırakayım hemen: https://developer.mozilla.org/tr/docs/Web/JavaScript/Reference/Functions/Arrow_functions

Antrenman

Şimdi ufak bir antrenman yapalım. Elimizde şu şekilde bir dizi olduğunu varsayalım:

var my_array = ["mustafa", 19, "zahid", "efe", 1998, 23, "zhdefe@gmail.com", "@baydeveloper", "mustafa@zahidefe.net"];

Elimizdeki karışık bir şekilde string ve integer veriler içeren dizimiz içerisinden sadece sayı veya mail adresi olanları elde eden bir program yazmanızı istiyorum.

Programı yazdıktan sonra kodlarınızı Github’a atıp linkini de bu gönderinin altına yorum olarak bırakırsanız çok sevinirim. Eğer bunu yaparsanız insanlar sizin çözüm yönteminizi görebilir ve siz de kodlarını paylaşan diğer insanların çözüm yöntemlerini görebilirsiniz. Bu hareket farklı bakış açıları kazanmanızı sağlar.

Bu yazılık bu kadar, başka yazılarda görüşene dek, kendinize iyi bakın 👋🏻

İlk Yorumu Siz Yapın

Bir cevap yazın

E-posta hesabınız yayımlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir