TypeScript Academy · Ders

?? ile Nullish Birleştirme

Tüm yanlış değerler için değil, yalnızca null ve undefined için yedek değerler sağlayın.

?? ile Nullish Birleştirme, CoddyKit'te ücretsiz bir TypeScript Academy dersidir. Bu, 4 dersinin 2. 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, TypeScript Academy öğrenme yolunun bir parçasıdır ve ilerlemeniz web ve CoddyKit uygulaması arasında senkronize olur. TypeScript Academy kursu toplamda 4 dersten oluşur.

Boş Değer Birleştirme İşleci

?? işleci, sağ tarafını yalnızca sol tarafı null veya undefined olduğunda döndürür. Diğer durumlarda sol taraftaki değeri döndürür. Varsayılan değer sağlamanın kesin yolu budur.

const name: string | null = null;
const display = name ?? 'Guest';
console.log(display); // 'Guest'

Yalnızca Boş Değerler Yedek Değere Geçişi Tetikler

Buradaki anahtar sözcük boş değerdir: yalnızca null ve undefined, sağ tarafın kullanılmasına neden olur. Yanlışlanabilir olanlar da dahil diğer tüm değerler değiştirilmeden aktarılır.

console.log(0 ?? 99);       // 0
console.log('' ?? 'x');     // ''
console.log(false ?? true); // false
console.log(null ?? 'def'); // 'def'

|| İşlecinin Sorunu

Mantıksal OR işleci ||, herhangi bir yanlışlanabilir değer için yedek değeri kullanır: 0, '', false, NaN ve boş değerler. 0 veya boş dizenin geçerli girdiler olduğu durumlarda bu genellikle hatalara yol açar.

const count = 0;
console.log(count || 10); // 10 — wrong! 0 is a valid count
console.log(count ?? 10); // 0  — correct

Varsayılanları Doğru Belirleme

Sıfır, boş dize veya false korumak istediğiniz geçerli değerlerse ?? kullanın. Her yanlışlanabilir değerin gerçekten yedek değere dönmesi gerektiği durumlarda || işlecini saklayın.

function volume(v: number | undefined): number {
  return v ?? 50; // 0 stays 0, undefined becomes 50
}
console.log(volume(0), volume(undefined));

?? İşleciyle İşlev Parametreleri

Yaygın bir kullanım, undefined geçirildiğinde isteğe bağlı bir parametre için varsayılan değer sağlamaktır; bu sırada anlamlı yanlışlanabilir girdiler korunur.

function greet(name?: string): string {
  return 'Hello, ' + (name ?? 'friend');
}
console.log(greet('Ada'), greet());

?? İşlecinin Sonuç Türü

a ?? b ifadesinin türü, a türündeki null | undefined değerlerini kaldırır ve b türüyle birleşir. a değeri string | null ve b değeri string ise sonuç string olur.

const maybe: string | null = null;
const sure: string = maybe ?? 'default';
console.log(sure.toUpperCase());

Varsayılanları Zincirleme

Birkaç kaynağı sırayla denemek için ?? işlecini zincirleyebilirsiniz. Bir değer boş olduğunda sonraki kaynağa geçilir. İlk boş olmayan değer kazanır.

const fromEnv: string | undefined = undefined;
const fromConfig: string | null = null;
const value = fromEnv ?? fromConfig ?? 'hardcoded';
console.log(value);

?? İşleci ve Öncelik

Belirsizliği önlemek için TypeScript, ?? işlecini || veya && ile parantez olmadan birlikte kullanmanıza izin vermez. Her zaman açıkça gruplandırın.

const a: number | null = null;
const b = true;
// const x = a ?? 5 || 10; // Error without parens
const x = (a ?? 5) || 10;
console.log(x);

Sıfırı Eksik Değerden Ayırma

Gerçek dünyada sık karşılaşılan bir ihtiyaç şudur: 0 sıcaklık, puan veya bakiye için geçerli bir veri olabilirken undefined, “sağlanmadı” anlamına gelir. ?? bu ikisini ayrı tutar; || ise birbirine karıştırır.

function format(temp: number | undefined): string {
  return (temp ?? 'N/A') + ' degrees';
}
console.log(format(0), format(undefined));

?? İşleciyle Nesne Özellikleri

İsteğe bağlı bir özelliği okuyup ona varsayılan değer vermek, ?? işlecinin günlük kullanımıdır. Bu işleç, bir sonraki derste birlikte kullanacağınız isteğe bağlı zincirlemeyle doğal biçimde eşleşir.

type Opts = { retries?: number };
function run(o: Opts): number {
  return o.retries ?? 3;
}
console.log(run({ retries: 0 }), run({}));

Hangisini Ne Zaman Seçmeli

Karar kuralı: 0, '' veya false korumanız gereken geçerli değerlerse ?? kullanın. Her yanlışlanabilir değerin gerçekten değiştirilmesini istiyorsanız || kullanın. Varsayılan değer hataları neredeyse her zaman alışkanlıkla || işlecine başvurmaktan kaynaklanır.

const username = '';
console.log(username || 'anon'); // 'anon' — empty replaced
console.log(username ?? 'anon'); // '' — empty kept

Hızlı Kontrol

Boş değer birleştirme konusunu anlayıp anlamadığınızı test edin.

Özet: Boş Değer Birleştirme

?? işlecinin:

Yalnızca sol taraf null veya undefined olduğunda yedek değeri döndürdüğünü,
|| işlecinin aksine 0, '' ve false gibi geçerli yanlışsal değerleri koruduğunu,
Sonuç türünden null | undefined değerlerini kaldırdığını,
|| veya && ile birlikte kullanıldığında parantez gerektirdiğini öğrendiniz.

Sırada ?. ve ?? işlecini birlikte kullanacağız.

function port(v: number | undefined): number {
  return v ?? 8080;
}
console.log(port(0), port(undefined));

Sıkça Sorulan Sorular

“?? ile Nullish Birleştirme” dersi ücretsiz mi?

Evet — “?? ile Nullish Birleştirme” 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 TypeScript Academy kursunun geri kalanını açmak için CoddyKit PRO'ya yükselt. TypeScript Academy kursu toplamda 4 dersten oluşur.

“?? ile Nullish Birleştirme” dersinde ne öğreneceğim?

Tüm yanlış değerler için değil, yalnızca null ve undefined için yedek değerler sağlayın. TypeScript 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.

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

Önceden deneyim gerekmez. CoddyKit'te TypeScript 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 2. dersidir.

“?? ile Nullish Birleştirme” 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 TypeScript Academy dersinde kod yazıp çalıştırabilir miyim?

Evet. Her TypeScript 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

← TypeScript Academy Sayfasına Dön