Menu

JavaScript if/else: Koşullar, else if ve Ternary Operatörü

JavaScript'te if/else nasıl çalışır? Koşul yazımı, else if zincirleri, truthy/falsy tuzakları ve ne zaman ternary operatörüne geçmen gerektiğini anlatıyoruz.

if Deyiminin Yapısı

Bir if deyimi, yalnızca koşul doğru olduğunda içindeki kod bloğunu çalıştırır. JavaScript'te if else kullanımı şu yapıdadır: anahtar kelime, parantez içinde bir koşul ve süslü parantezler arasında bir blok:

index.js
Output
Click Run to see the output here.

age >= 18 koşulu true döndüğü için blok çalışır. Eğer age değeri 16 olsaydı, koşul false olur ve JavaScript bu bloğu tamamen atlardı.

Tek satırlık bir ifade için süslü parantezler teknik olarak zorunlu değil ama siz yine de her zaman kullanın. Parantezsiz if kullanımı, ilerde birisi ikinci bir satır eklediğinde ve aslında bloğun içinde olmadığını fark etmediğinde ortaya çıkan klasik bir hata kaynağıdır.

else: Alternatif Dal

if ile else'i birlikte kullanarak koşul sağlanmadığında farklı bir kod çalıştırabilirsiniz:

index.js
Output
Click Run to see the output here.

Tam olarak iki daldan biri çalışır. Asla ikisi birden, asla hiçbiri değil. else kendi başına bir koşul almaz — if yanlış çıktığında devreye giren "her şey dahil" dalıdır.

else if: Birden Fazla Seçenek Arasından Seçim Yapmak

İkiden fazla durumun varsa, bunları else if ile zincirle. JavaScript koşulları sırayla kontrol eder ve ilk doğru olanda durur:

index.js
Output
Click Run to see the output here.

Yalnızca tek bir dal çalışır. Bir koşul eşleştiği anda geri kalanlar atlanır — o koşullar da doğru olsa bile. İşte bu yüzden sıralama önemli: zinciri tersine çevirip önce score >= 60 kontrolünü yapsaydınız, 60'ın üzerindeki herkese D notu verilirdi.

Sondaki else zorunlu değil, ama eklemek niyetinizi netleştirir: "Hiçbiri tutmadıysa şunu yap."

Koşul Olarak Herhangi Bir İfade Kullanabilirsiniz

Parantezin içine yazdığınız şeyin ille de bir karşılaştırma olması gerekmiyor. Herhangi bir ifade olabilir — JavaScript sonucu otomatik olarak boolean'a çevirir (truthy/falsy mantığı):

index.js
Output
Click Run to see the output here.

Boş olmayan string'ler truthy sayılır. 0 ve boş string ise falsy olduğundan, items.length değeri 0 olduğunda else bloğuna düşülür. JavaScript'te "içinde bir şey var mı?" kontrolü yapmanın standart yolu budur.

Falsy değerlerin listesi kısadır ve ezberlemeye değer: false, 0, -0, 0n, "", null, undefined ve NaN. Bunların dışındaki her şey truthy'dir — "0", "false", [] ve {} dahil. Özellikle son ikisi çoğu kişiyi tuzağa düşürür.

Koşulları birleştirme: && ve ||

Birden fazla koşulu birleştirmek için && (ve) ile || (veya) operatörlerini kullanırız:

index.js
Output
Click Run to see the output here.

&& her iki tarafın da truthy olmasını ister, || ise en az birinin truthy olması yeter. İkisi de kısa devre yapar: && ilk falsy değerde durur, || ise ilk truthy değerde. Bu davranış, ikinci koşulun bir yan etkisi olduğunda ya da hata fırlatacağı durumlarda işinize yarar — örneğin user && user.name ifadesi, user değeri null ise patlamak yerine güvenle undefined döndürür.

Karışık mantık kullanırken önceliği netleştirmek için parantez kullanın:

index.js
Output
Click Run to see the output here.

Parantez kullanmazsan && operatörü || operatöründen daha sıkı bağlanır ki bu genelde okurken beklediğinin tam tersidir.

== ve === farkı (her zaman === kullan)

Bir if içinde eşitlik kontrolü yaparken == ve != yerine === ve !== kullan:

index.js
Output
Click Run to see the output here.

== karşılaştırma yapmadan önce tip dönüşümü uygular; bu yüzden "" == 0 ya da null == undefined gibi ifadeler true dönerek sizi şaşırtabilir. === ise tip dönüşümü yapmaz — hem tip hem de değer aynı olmalıdır. Varsayılan olarak === kullanın. Yaygın tek istisna x == null kalıbıdır; bu tek seferde hem null hem de undefined kontrolünü yapar.

Ternary Operatörü ile Kısa Yazım

İki değer arasında seçim yaparken, koşul ? a : b şeklindeki ternary operatörü çoğu zaman tam bir if/else bloğundan çok daha temiz durur:

index.js
Output
Click Run to see the output here.

Ternary bir ifadedir — yani bir değer üretir. if/else'ten en temel farkı da bu: o bir deyim (statement), ternary ise değer döndürür. Sonucu bir yerde kullanacaksan (değişkene atama, return, string kurma gibi) ternary tercih et. Sadece yan etki çalıştıracaksan (side effect) if/else daha uygundur.

Ternary'leri zincirleyebilirsin de, ama okunabilirlik bir anda uçuruma yuvarlanır:

// Bunu yapma:
const grade = score >= 90 ? "A" : score >= 80 ? "B" : score >= 70 ? "C" : "F";

Zincirleme yapıyorsanız else if'e geri dönün.

İç içe if vs. Düz else if zinciri

Bazen bir koşul ancak başka bir koşulun içinde anlam kazanır. Bu gibi durumlarda iç içe if kullanmakta bir sakınca yok:

index.js
Output
Click Run to see the output here.

Ne var ki üç-dört seviye iç içe if yazmak kod kokusudur. Böyle durumlarda erken return kullanarak ya da koşulları birleştirerek yapıyı düzleştirin:

index.js
Output
Click Run to see the output here.

Early return kullanmak her dalı kısa tutar ve aynı girinti seviyesinde kalmasını sağlar. İç içe geçmiş if piramidine kıyasla gözle takip etmesi çok daha kolaydır.

Sık Yapılan Hata: if İçinde Atama

= atama yapar, === ise karşılaştırır. Bu ikisini koşul içinde karıştırmak klasik bir bug sebebidir:

index.js
Output
Click Run to see the output here.

status = "done" ifadesi, status değişkenine "done" değerini atar ve ifadenin kendisi "done" olarak değerlendirilir. Bu da truthy olduğu için blok her zaman çalışır ve sen farkında olmadan değişkenin üzerine yazmış olursun. Linter'lar bu hatayı yakalar; strict mode yakalamaz. Dikkatli ol ve karşılaştırma yapmak istiyorsan === kullan.

Sırada: switch

Tek bir değeri birden fazla olası eşleşmeyle karşılaştırdığında, uzun bir else if zinciri bir süre sonra tekrara düşmeye başlar. JavaScript'in switch yapısı tam da bu senaryo için tasarlanmıştır — ama break ve fall-through konusunda kendine has bazı tuhaflıkları var. Bir sonraki bölümde onlara bakacağız.

Sıkça Sorulan Sorular

JavaScript'te if/else yapısı nasıl yazılır?

if anahtar kelimesinin ardından parantez içinde koşulu, sonra süslü parantezler içinde çalışacak bloğu yazarsın. Arkasına else ve alternatif bloğu eklersin. Örnek: if (age >= 18) { console.log('adult'); } else { console.log('minor'); }. Koşul herhangi bir ifade olabilir; JavaScript bunu otomatik olarak boolean'a çevirir.

else if ile iç içe if arasındaki fark nedir?

else if koşulları zincirler: JavaScript her koşulu sırayla kontrol eder, ilk eşleşmede durur ve sadece o blok çalışır. İç içe (nested) if ise bir if'in içine başka bir if koymaktır; genelde ilk koşul doğruyken ikinci bir şeyi daha kontrol etmek için kullanılır. Çoğu zaman düz bir else if zinciri, iç içe geçmiş if'lerden çok daha okunaklıdır.

if/else yerine ternary operatörünü ne zaman kullanmalıyım?

condition ? a : b şeklindeki ternary'yi bir ifade içinde iki değer arasında seçim yaparken kullan: değişkene atama, fonksiyondan değer döndürme, string oluşturma gibi durumlarda ideal. Dallar yan etkili ifadeler içeriyorsa ya da taraflardan biri kısa bir ifadeden uzunsa if/else kullanmaya devam et. Zincirlenmiş ternary'ler çok hızlı okunmaz hale gelir.

Neden if (0) ile if (false) aynı şekilde davranır?

Aslında davranışları aynı; ikisi de bloğu atlar. JavaScript koşulu boolean'a çevirir ve 0, '', null, undefined, NaN, false değerlerinin hepsi falsy sayılır. Asıl tuzak şurada: '0' (boş olmayan string) ve [] (boş dizi) truthy'dir. Diğer dillerden gelenleri en çok şaşırtan nokta da budur.

Coddy ile kodlamayı öğren

BAŞLA