“Optional Chaining” Kavramı
Bu yazımızda, programlama dillerinde sıkça karşılaşılan ve özellikle modern dillerde popüler hale gelen “Optional chaining” konseptine odaklanacağız.
“Optional Chaining” Nedir?
“Optional chaining”, dilin sözdizimi içerisinde bir nesnenin özelliklerine veya metodlarına güvenli bir şekilde erişim sağlama yeteneğidir. Bu yetenek sayesinde, bir özelliğin veya metotun mevcut olup olmadığını kontrol etmek için uzun ve karmaşık koşullu ifadeler yazmaya gerek kalmaz.
Nesne özelliklerine güvenli ve daha kısa bir şekilde erişmek için kullanılan bu özellik, özellikle iç içe geçmiş nesnelerin özelliklerine erişirken, bir özelliğin veya alt özelliğin bulunmaması durumunda hata önlemeye yardımcı olur.
JavaScript’te “Optional Chaining” Kullanımı
“Optional chaining”, birçok modern programlama dilinde benzer biçimlerde mevcuttur veya bu dillerin bazılarında benzer işlevselliği sağlayan farklı mekanizmalar bulunmaktadır. JavaScript (ES2020 versiyonuyla) bu özelliği ?. operatörü ile getirmiştir ve şu şekilde çalışır:
- Eğer nesne veya özellik mevcutsa, ilgili değeri döndürür.
- Eğer nesne veya özellik mevcut değilse, hata üretmeden
undefineddeğeri döndürür.
Bu özellik, JavaScript gibi programlama dillerinde daha okunabilir ve anlaşılır kod yazmayı sağlayan bir tür syntactic sugar örneğidir. Ne işe yaradığını ve nasıl kullanıldığını bir örnek üzerinden inceleyelim:
|
1 2 3 4 5 6 7 |
const user = { name: "Ali", address: { street: "Çiçek Sokak", city: "İstanbul" } }; |
Yukarıdaki örneğimizde yer alan user nesnesinin address özelliğindeki city değerine erişmek istesek, geleneksel olarak şu şekilde bir yöntem izlerdik:
|
1 2 |
// Geleneksel Yaklaşım const city = user && user.address && user.address.city; |
Bu yaklaşım, user ve user.address nesnelerinin var olup olmadığını kontrol eder ve eğer herhangi biri mevcut değilse, herhangi bir hata üretmez ve city değişkenine undefined değeri atanır. Ancak bu kodu optional chaining kullanarak aşağıdaki gibi yazabiliriz:
|
1 2 |
// Optional chaining const city = user?.address?.city; |
?. operatörü ile benzer şekilde, user ve user.address nesnelerinin var olup olmadığını kontrol edilir ve eğer herhangi biri mevcut değilse, hata üretmeden city değişkenine undefined değeri atanır.
İki yöntemi kıyaslayınca optional chaning’in ne kadar temiz ve okunaklı bir kod yazımı sağladığı görülmektedir.
Bir başka örnek daha yapıp yazımızı sonlandıralım:
|
1 2 3 4 5 6 7 8 9 |
const ogrenci = { isim: "Ahmet", adres: { il: "İstanbul", ilce: "Beşiktaş" } }; console.log(ogrenci.adres?.mahalle); // Eğer 'mahalle' özelliği mevcut değilse, 'undefined' dönecek, hata almayacaksınız. |
Yukarıdaki örneğimizde, ogrenci adında bir nesne tanımlanmıştır. Bu nesnenin içinde isim ve adres adında iki özellik bulunmaktadır. adres özelliği ise il ve ilce olmak üzere kendi içinde iki alt özelliğe sahiptir.
Derken, bu nesnenin adres altındaki mahalle isimli bir özelliğini kullanmak istedik diyelim. Ancak, bu özellik ogrenci nesnesinde tanımlı değil. Eğer ogrenci.adres.mahalle şeklinde doğrudan erişmeye çalışırsak, bu özellik mevcut olmadığı için JavaScript hata verecektir.
Ancak ES2020 ile getirilen “Optional Chaining” özelliği sayesinde ?. operatörü kullanarak ogrenci.adres?.mahalle şeklinde bir erişim sağladığımızda, JavaScript bize bir hata vermeyecek sadece undefined döndürecektir.
Haliyle kod yazarken karşılaşabileceğimiz “Cannot read property ‘X’ of undefined” türündeki hataların önüne geçmekte büyük bir kolaylık sağlar.
Bu özellik, özellikle API cevapları veya dış kaynaklardan gelen belirsiz yapıdaki verilerle çalışırken çok kullanışlıdır. Bir özelliğin mevcut olup olmadığını kontrol etmeden doğrudan erişim sağlamak istediğinizde işinizi kolaylaştırır.