CodeBlanks Logo Icon CodeBlanks
Giriş Yap Kayıt Ol

Optional chaining

?. ile null-safe erişim öğrenirsin.

Optional chaining

Bir nesnenin iç içe özelliğine erişirken ara değerlerin null veya undefined olma riskini optional chaining operatörü ?. ile yönetirsin. user?.address?.city çağrısı, user veya address null/undefined ise hata fırlatmadan undefined döndürür.

Geleneksel yöntemle aynı kontrol user && user.address && user.address.city yazımını gerektirir; bu uzun ve hata yapmaya açıktır. ?. ile aynı sonucu kısa ve güvenli biçimde alırsın. API yanıtları gibi bazı alanların bulunmayabileceği verilerde özellikle yararlıdır.

null ile undefined farkı

JavaScript'te null bilinçli olarak "değer yok" anlamında, undefined ise "tanımlanmamış" anlamında kullanılır. Bir değişkene henüz değer atanmadıysa undefined olur; programcı boş bırakmak isterse null yazar.

Optional chaining her ikisini de güvenli biçimde ele alır: x?.y ifadesinde x ister null ister undefined olsun sonuç undefined'dir. Hata fırlatılmaz. Bu özellik sayesinde iç içe veriye erişirken try/catch veya uzun && zincirleri yazmadan güvenli kod üretirsin.

Uygulama Kullanıcı adresini al

user değişkeni null değerini taşıyor. city adında bir değişken tanımla ve user?.address?.city sonucunu ata. Sonra city'yi console.log ile yazdır. Çıktı tek satırda undefined olmalı.

Başlangıç kodu

index.js
const user = null;
// city değişkenini ?. ile tanımla ve yazdır

Örnek çözüm

index.js
const user = null;
const city = user?.address?.city;
console.log(city);

Beklenen çıktı

undefined

Soru ve cevaplar

Dersin sorularını cevaplarıyla birlikte inceleyebilirsin. Kendini denemek istersen dersi interaktif olarak çöz.

1 Optional chaining yaz

Soru 
const city = user____address?.city;
Cevap 
const city = user?.address?.city;

Açıklama: ?. ile null-safe erişim sağlanır.

2 null?.city sonucu ne olur?

index.js
null?.city
  • "city"
  • true
  • null.city hatası
  • undefined Doğru cevap

Açıklama: ?. null'da hata fırlatmaz; undefined döner.

3 Operatörü anlamına eşle

Kavram Anlamı
?. Null-safe erişim
. Sıradan erişim
?? Nullish birleştirme
|| Veya mantığı

Başlangıç bölümündeki tüm dersler

1 Node.js temelleri

  1. Node.js nedir?
  2. İlk program
  3. ES modules
  4. package.json
  5. CommonJS vs ESM
  6. Özet - Node.js temelleri

2 Değişkenler

  1. let ve const
  2. var ve scope
  3. Tür çıkarımı
  4. Destructuring
  5. Spread ve rest
  6. Özet - Değişkenler

3 Veri türleri

  1. Primitif türler
  2. Template literals
  3. Number ve Math
  4. Symbol
  5. typeof
  6. Özet - Veri türleri

4 Proje: Hesap makinesi

  1. Proje tasarımı
  2. Toplama ve çıkarma
  3. Çarpma ve bölme
  4. process.argv
  5. Birleştirme

5 Operatörler

  1. Aritmetik operatörler
  2. Atama operatörleri
  3. Karşılaştırma operatörleri
  4. Mantıksal operatörler
  5. Nullish coalescing
  6. Özet - Operatörler

6 Dizeler

  1. String metotları
  2. String arama
  3. substring ve slice
  4. replace ve split
  5. padStart ve trim
  6. Özet - Dizeler

7 Koşullar

  1. if deyimi
  2. else ve else if
  3. switch
  4. Ternary
  5. Optional chaining
  6. Özet - Koşullar

8 Döngüler

  1. for döngüsü
  2. while döngüsü
  3. for...of
  4. for...in
  5. break ve continue
  6. Özet - Döngüler

9 Proje: Alışveriş sepeti

  1. Sepet tasarımı
  2. Ürün ekleme
  3. Toplam hesaplama
  4. Sepeti listeleme
  5. Birleştirme

10 Diziler

  1. Dizi tanımlama
  2. Dizi erişimi
  3. push ve pop
  4. shift ve unshift
  5. splice ve slice
  6. Özet - Diziler

11 Dizi metotları

  1. map
  2. filter
  3. reduce
  4. find ve some
  5. forEach
  6. Özet - Dizi metotları

12 Nesneler

  1. Nesne literal
  2. Özellik erişimi
  3. Computed property
  4. Object methods
  5. Object spread
  6. Özet - Nesneler

13 Fonksiyonlar

  1. Fonksiyon tanımlama
  2. Return değerleri
  3. Arrow functions
  4. Default parametreler
  5. Rest parametreleri
  6. Özet - Fonksiyonlar

14 Callback'ler

  1. Callback nedir?
  2. Higher-order functions
  3. forEach ile callback
  4. Error-first callback
  5. Callback hell
  6. Özet - Callback'ler

15 Proje: Yapılacaklar listesi

  1. Görev modeli
  2. Görev ekleme
  3. Görev listeleme
  4. Görev tamamlama
  5. Birleştirme

16 Promise'lar

  1. Promise nedir?
  2. then ve catch
  3. Promise.all
  4. Promise.race
  5. finally
  6. Özet - Promise'lar

17 async/await

  1. async function
  2. await
  3. try/catch
  4. Promise.all ile await
  5. Sequential await
  6. Özet - async/await

18 fs modülü

  1. fs.promises
  2. readFile
  3. writeFile
  4. appendFile
  5. existsSync
  6. Özet - fs modülü

19 path modülü

  1. path.join
  2. path.resolve
  3. path.parse
  4. path.dirname ve basename
  5. path.extname
  6. Özet - path modülü

20 Başlangıç finali

  1. Proje tasarımı
  2. Veri modeli
  3. İş mantığı
  4. fs ile kalıcılık
  5. Birleştirme