JavaScript Academy · Ders

İsteğe Bağlı Çağrılar ve Dizin Erişimi

Çağrılar ve köşeli parantezlerle isteğe bağlı zincirlemeyi kullanın.

4. ders / 413 adım

İsteğe Bağlı Çağrılar ve Dizin Erişimi, CoddyKit'te ücretsiz bir JavaScript Academy dersidir. Bu, 4 dersinin 4. dersidir. Aşağıdan dersin tamamını ücretsiz okuyabilir, sonra tarayıcıda yerleşik kod editörü ve 7/24 yapay zeka koçu ile uygulamalı olarak pratik yapabilirsin. Bu, JavaScript Academy öğrenme yolunun bir parçasıdır ve ilerlemeniz web ve CoddyKit uygulaması arasında senkronize olur. JavaScript Academy kursu toplamda 4 dersten oluşur.

Özellik Okumalarının Ötesi

İsteğe bağlı zincirlemenin, işlevleri çağırmak ve dizi veya dinamik anahtar öğelerine güvenle erişmek için de biçimleri vardır.

const obj = { greet: () => "hi" };
console.log(obj.greet?.()); // "hi"

İsteğe Bağlı Yöntem Çağrıları

?.() biçimi, bir işlev yalnızca mevcutsa çağırır. Yöntem null veya undefined ise hata fırlatmak yerine undefined döndürür.

const obj = {};
console.log(obj.greet?.()); // undefined, no error

Bu Neden Önemli

Bu biçim olmadan eksik bir yöntemi çağırmak hata fırlatır. İsteğe bağlı çağrı biçimi, isteğe bağlı geri çağırmaları temiz bir şekilde korur.

function run(onDone) {
  onDone?.(); // safe whether or not onDone is provided
}
run();
run(() => console.log("done"));

Çağrıyı Yalnızca Null veya Undefined Atlar

?.() yalnızca değer null veya undefined olduğunda çağrıyı atlar. Değer işlev olmayan bir değerse çağrı sırasında yine TypeError alırsınız.

const obj = { greet: 42 };
try {
  obj.greet?.();
} catch (e) {
  console.log("not a function");
}

İsteğe Bağlı İndis Erişimi

?.[ ] biçimi, temel değer null veya undefined değilse bir öğeyi okur; diziler ve hesaplanan anahtarlar için kullanışlıdır.

const arr = ["a", "b"];
console.log(arr?.[1]); // "b"
const none = null;
console.log(none?.[0]); // undefined

Dinamik Anahtarlar

?. ile köşeli parantez erişimi, dinamik özellik adlarını güvenle işler.

const data = { user: { name: "Mia" } };
const key = "name";
console.log(data.user?.[key]); // "Mia"

İç İçe Diziler

İsteğe bağlı indis erişimini iç içe diziler veya nesneler boyunca zincirleyebilirsiniz.

const grid = [[1, 2], [3, 4]];
console.log(grid?.[1]?.[0]); // 3
console.log(grid?.[5]?.[0]); // undefined

Döndürülen Değere İsteğe Bağlı Çağrı

Biçimleri birleştirebilirsiniz: Bir değeri isteğe bağlı olarak okuyup ardından onu isteğe bağlı olarak çağırabilirsiniz.

const handlers = { click: () => "clicked" };
console.log(handlers.click?.()); // "clicked"
console.log(handlers.hover?.()); // undefined

Varsayılan Değerlerle Birleştirme

Sonuca bir yedek değer vermek için bu biçimleri ?? ile eşleştirin.

const config = {};
const port = config.get?.() ?? 3000;
console.log(port); // 3000

Dizi Yöntemlerini Güvenle Çağırma

İsteğe bağlı zincirleme, ayrıca varlık kontrolü yapmadan bulunmayabilecek bir dizi üzerinde yöntem çağırmanıza olanak tanır.

const state = { tags: null };
console.log(state.tags?.join(", ") ?? "none"); // "none"

İsteğe Bağlılığın Gerçek Olduğu Yerde Kullanın

Bu biçimler, isteğe bağlı geri çağırmalar ve belirsiz veri yapıları için çok kullanışlıdır. Bir değerin her zaman var olması gerektiğinde bunlardan kaçının; böylece gerçek hatalar görünür olmaya devam eder.

const events = { onSave: null };
events.onSave?.("payload"); // silently does nothing
console.log("continued");

Kısa Kontrol

Güvenli çağrı biçimini seçin.

İnteraktif derste cevapla

Özet

İsteğe bağlı zincirleme, güvenli yöntem çağrıları için ?.() ve güvenli indis veya dinamik anahtar erişimi için ?.[ ] biçimlerini içerir. Her ikisi de temel değer null veya undefined olduğunda undefined döndürür; ancak işlev olmayan bir değer çağrılırsa yine hata fırlatır. Varsayılan değerler için bunları ?? ile birleştirin ve yalnızca gerçekten isteğe bağlı değerlerde kullanın.

Başlamak ücretsiz

Yapay zeka eğitmeniyle JavaScript öğren — ücretsiz

Tarayıcında gerçek kod yaz ve çalıştır, 7/24 yapay zeka eğitmeninden anında yardım al; web'de ya da uygulamada kaldığın yerden devam et.

Kurslar: 59
Dersler: 200

Ücretsiz öğrenmeye başla Tüm kursu görüntüle

Sıkça Sorulan Sorular

“İsteğe Bağlı Çağrılar ve Dizin Erişimi” dersi ücretsiz mi?

Evet — “İsteğe Bağlı Çağrılar ve Dizin Erişimi” dersin tüm metni burada web'de ücretsiz olarak okunabilir. Etkileşimli olarak pratik yapmak (yerleşik kod editörü ve 7/24 yapay zeka koçu) ve JavaScript Academy kursunun geri kalanını açmak için CoddyKit PRO'ya yükselt. JavaScript Academy kursu toplamda 4 dersten oluşur.

“İsteğe Bağlı Çağrılar ve Dizin Erişimi” dersinde ne öğreneceğim?

Çağrılar ve köşeli parantezlerle isteğe bağlı zincirlemeyi kullanın. JavaScript Academy ile uygulamalı kodu tarayıcıda doğrudan çalıştırarak pratik yaparsın ve 7/24 yapay zeka koçu dersi çalışırken sorularını yanıtlar.

JavaScript Academy öğrenmeye başlamak için deneyim gerekli mi?

Önceden deneyim gerekmez. CoddyKit'te JavaScript Academy, başlangıçtan ileri seviyeye kadar yapılandırıldığı için buradan başlayabilir veya başından başlayıp kendi hızında ilerleme yapabilirsin. Bu, 4 dersinin 4. dersidir.

“İsteğe Bağlı Çağrılar ve Dizin Erişimi” dersi ne kadar sürer?

Çoğu CoddyKit dersi yaklaşık 5–10 dakika sürer. Her biri kısa ve etkileşimli olduğu için sabit ilerleme yaparsın ve web ile uygulama arasında tam olarak bıraktığın yerden devam edebilirsin.

Bu JavaScript Academy dersinde kod yazıp çalıştırabilir miyim?

Evet. Her JavaScript Academy dersi yerleşik bir kod editörü içerir, bu sayede tarayıcıda gerçek kod yazıp çalıştırabilir ve anlık yapay zeka geri bildirimi alırsın — yerel kurulum gerekli değildir.

Bu kursun tüm dersleri

← JavaScript Academy Sayfasına Dön