Javascript’te .find() Array Fonksiyonu

Javascript’te arrayler ile işimiz varsa en çok kullandığımız fonksiyonların başında .find() array fonksyionu gelmektedir. Özet olarak ne işe yaradığına değinmek gerekirse, bir dizi içerisinde belirttiğimiz özelliklerde bir elemanı döndürmeye yaramaktadır.

Örneğin, dizimiz içerisindeki elemanlar içerisinde yer alan objelerde isim isminde bir property var. Ve biz isim değeri Mustafa Çağrı Güven olan elemanı bulmak istiyoruz. İşte bu durumda aklımıza gelecek olan ilk fonksiyon gelmelidir.

.find Array Fonksiyonu Ne Zaman Kullanılır?

Array içerisinde sadece bir tane eleman döndürmek istiyorsak .find() fonksiyonunu kullanırız. Eğer ki birden fazla eleman döndürmek istiyorsak da bir sonraki yazının konusu olan .filter() fonksiyonunu kullanıyoruz.

Örnek Datamız

[
    {"isim": "Mustafa Çağrı Güven", "yas": 33, "sehir": "Ankara", "boy": 188, "kilo": 88, "cinsiyet": "erkek", "gozRengi": "kahve"},
    {"isim": "Ahmet Güven", "yas": 83, "sehir": "Balıkesir", "boy": 162, "kilo": 80, "cinsiyet": "erkek", "gozRengi": "siyah"},
    {"isim": "Ali Güven", "yas": 92, "sehir": "Balıkesir", "boy": 182, "kilo": 90, "cinsiyet": "erkek", "gozRengi": "ela"},
    {"isim": "Emine Güven", "yas": 83, "sehir": "Balıkesir", "boy": 172, "kilo": 70, "cinsiyet": "kadın", "gozRengi": "ela"},
    {"isim": "Afra Güven", "yas": 8, "sehir": "Dursunbey", "boy": 122, "kilo": 24, "cinsiyet": "kadın", "gozRengi": "kahve"},
    {"isim": "Eslem Güven", "yas": 14, "sehir": "Dursunbey", "boy": 152, "kilo": 41, "cinsiyet": "kadın", "gozRengi": "yeşil"}
]

Yukarıdaki gibi örnek bir datamız olduğunu varsayarak, kodlarımızı yazmaya başlıyoruz. Ve bu datamızın da kisiler.json dosyası içerisinde olduğunu düşünüyoruz. İlk olarak require ile json dosyamızı kodlarımızı yazacağımız find.js dosyasına dahil ediyoruz.

Github’ta require ile json dosyasını find.js’ye dahil ettim ancak, alttaki JSFiddle örneğinde mecbur kalıp tek bir dosya içerisinde datayı kullanmam gerekti.

.find() İle Sonuç Bulamazsak?

Her zaman her şey yolunda gidecek diye bir şey yok değil mi? Şimdi array içerisinde hiçbir sonuç bulamazsak ne olacak? Fonkstion null mı dönecek? Boş bir obje mi dönecek?

Sonuç bu durumda undefined olacaktır. Bu nedenle de farklı yöntemler kullanarak sonucun undefined olmamasını sağlayabiliriz. Gelin örneklerle devam edelim.

İlk örneğimizde yaşı 83 olan kişiyi (kişileri değil!) buluyoruz.

Sonraki örneklerimiz de işi biraz daha pekiştirmemize yarıyor. Taa ki, 5. örneğe gelene kadar.

Yukarıda bahsettiğim üzere, sonuç bulamazsak bize undefined dönülecektir. Bazı durumlarda bu sıkıntıya sebep verebilir. Bu nedenle de biz önlem olarak sonuç bulunamazsa ne dönüş yapılacağını kendimiz de belirleyebiliriz. Bunun için de 5. ve 6. örnekleri kullanabiliriz.

Magic Stringlerden Kurtulun!

Ayrıca, dikkatinizi çekti mi bilmiyorum ancak burada bir magic string (Wikipedia’da magic string) kullanımı söz konusu. Fakat, bu tercih edilmeyen, hatta ve hatta kullanılmaması gereken bir kod yazım yöntemidir. O yüzden de yukarıda bir yerde

let sonucYok = "Sonuç bulunamadı"

şeklinde bir değer tanımlama yapıp aşağıda da

console.log(yas100 || sonucYok)

şeklinde kullanmamız kod kalitemizi artıracaktır. Kaliteden ziyade işlerinizide hafifletecektir. Çünkü bir değişiklik gerektiğinde birden fazla yerde tek tek bu “sonuç yok” stringini değiştirmeniz gerekiyor. Üstte bir yerde bir değişkene bunu tanımlarsanız tek bir yerden işinizi halletmiş olursunuz.

Buradaki mantık şu: yas100 değişkenini bulamıyorsan, sonucYok değişkenini ver bana. İşte bu kadar basit!

Magic Stringler İçin Daha İyisi?

Daha iyisini yapabilirim dediğini duyar gibiyim? Daha iyi bir yöntem biliyor musun? Evet, evet, daha iyisi de mümkün.

Bu tarzda mesajlarınızı tek bir dosya içerisine yazabilir ve projenize bu dosyayı ekleyebilirsiniz. Örneğin, HataMesajlari.js isminde bir dosya oluşturup bu tarzda stringleri orada tutabilirsiniz. Çok büyük bir projede bu yapının ne kadar fayda sağlayacağını düşünsenize. Tek bir yerden tüm projedeki mesajları değiştiriyorsunuz, muhteşem!

Projenizin gidişatına göre çok daha farklı yöntemler de kullanabilirsiniz. Bu biraz da sizin tercihinize kalıyor. Öyle ki bunu sadece Javascript işlerinizde değil, muhtemelen tüm dillerdeki projelerde uygulayabilirsiniz.

Evet, bir yazının daha sonuna geldik. Bir sonraki yazıda .find() array fonksiyonun büyük kardeşi .filter() ile devam edeceğiz.