Cevap.

Optional chaining mekanizması (?.), JavaScript'te, isteğe bağlı olarak tanımlanmış nesnelerin özelliklerine ve yöntemlerine güvenli bir şekilde erişim sağlamak amacıyla ortaya çıkmıştır. TypeScript'te özellikle faydalıdır çünkü undefined veya null olan özelliklere veya yöntemlere erişimle ilgili çalışma zamanı hatalarını önlemeye yardımcı olur.

Konunun Geçmişi

Optional chaining'den önce, geliştiricilerin her bir nesne iç içe geçmiş seviye varlığını manuel olarak kontrol etmesi gerekiyordu, bu da kodu uzun ve okunması zor hale getiriyordu:

if (obj && obj.a && obj.a.b) {
  // ...
}

Sorun

Tanımsız bir nesneye erişimle ilgili iç içe geçmiş özelliklere erişirken çalışma zamanı hatası olasılığı vardı: Cannot read property 'x' of undefined. Ayrıca, uzun kontrol zincirleri, kodun bakımını ve algılama kolaylığını zorluyordu.

Çözüm

Optional chaining (?.), iç içe geçmiş özelliklere, yöntemlere veya dizi elemanlarına erişim sağlarken, herhangi bir kısım null veya undefined ise otomatik olarak undefined döner.

Kod örneği:

interface User {
  name: string;
  address?: {
    city?: string;
  };
}

const user: User = { name: 'Ivan' };
console.log(user.address?.city); // undefined

Anahtar özellikler:

Kısa, güvenli ve anlaşılır bir kod yazmayı sağlar.
Özelliklere, yöntemlere ve dizi indekslerine erişimde çalışır.
Döndürülen değer tipi — T | undefined, bu TypeScript derleyicisi tarafından dikkate alınır ve hataların önlenmesine yardımcı olur.

Kandırmaca Sorular.

Atama operatöründen önce optional chaining kullanabilir miyim? Örneğin: user.address?.city = 'Moscow'?

Hayır, optional chaining atama ifadesinin sol tarafında kullanılamaz, bu bir derleme hatası oluşturur. Optional chaining, yalnızca okuma sırasında çalışır, yazımda değil.

Nesne tanımlı değilse yöntemi çağırmak için optional chaining'den yararlanabilir miyim? Örneğin: user?.logInfo()?

Evet, çağrı noktasına kadar nesne undefined/null olabilir, bu durumda user?.logInfo() hata fırlatmaz ve kullanıcı tanımlı değilse sadece undefined döner.

user?.logInfo(); // eğer kullanıcı tanımlıysa, logInfo çağrılacak, aksi takdirde hiçbir şey olmayacak

Optional chaining ile eski stil '&&' operatörü arasındaki fark nedir, örneğin: user && user.address && user.address.city?

Optional chaining daha kısadır, tüm tiplerle (yöntemler ve diziler dahil) çalışır ve TypeScript bunu tür kontrolünde dikkate alır. Ayrıca, '&&' operatörünü kullanırken, istemeden true/false veya undefined yerine iç içe geçmiş bir değer alabilirsiniz. Optional chaining ise ya beklenen türü ya da undefined verir, bu da tür çıkışıyla dikkate alınır.

Tipik Hatalar ve Anti-Desenler

Optional chaining'in atama sırasında iç içe geçmiş nesneleri "yarattığını" beklemek — bu doğru değildir.
Optional chaining'i asla undefined/null olamayacak değişkenlere erişirken kullanmak (gereksiz ve işe yaramaz kod).
Optional chaining'i her yerde düşünmeden kullanma alışkanlığı, kodun daha sonraki bakımını zorlaştırır.

Hayattan Bir Örnek

Olumsuz Durum

Kodda, iş mantığı gereği her zaman tanımlı olan değişkenlerde bile uzun optional chaining zincirleri kullanılıyor:

order?.customer?.address?.city = 'London';

Artıları:

Özelliklerin tanımsız olma ihtimaline karşı koruma sağlar.

Eksileri:

Eşitlik sağlanmaz, eğer özelliklerden biri bile yoksa, hata bildirme veya işlenmesi olmadan; "gizli" bir mantık ortaya çıkar, kod karmaşıklaşır.

Olumlu Durum

Sadece dış verilere erişimde veya gerçekten tanımsız olma ihtimali olan yerlerde optional chaining kullanılıyor:

const city = apiResponse?.info?.location?.city || 'Unknown';