Mert Özen Her Satırda Daha İleri
Frontend JavaScript Temel — #05

JavaScript Operatörleri: Aritmetik, Eşitlik, Mantıksal Operatörler ve Truthy/Falsy

Mert Özen 3 Kas 2026 9 dk 3 görüntülenme
JavaScript Operatörleri: Aritmetik, Eşitlik, Mantıksal Operatörler ve Truthy/Falsy

Aritmetik ve atama operatörlerini, karşılaştırmayı, == ile === farkını ve coercion'ı, truthy/falsy değerleri, && ile || kısa devresini, ?? operatörünü ve öncelik tuzaklarını görüyoruz.

Sürüm notu: Bu yazıdaki kodlar ES2026 ve güncel tarayıcılar (Chrome, Edge, Firefox, Safari) içindir.

Önce Tahmin Et

Dört kısa satır, dört soru:

console.log(0 || "default");
console.log(0 ?? "default");
console.log("5" == 5);
console.log("5" === 5);

İlk iki satır neredeyse aynı görünüyor, son ikisi de öyle. Peki çıktıları da aynı mı? Okumaya devam etmeden önce dört satırın her biri için bir tahmin yap. Cevapları, ilgili operatörleri tanıdıkça tek tek açıklayacağız.

Aritmetik Operatörler

Başlangıç noktası tanıdık: dört işlem. Bunu tarayıcının konsoluna yapıştırıp dene:

console.log(7 + 3);
console.log(7 - 3);
console.log(7 * 3);
console.log(7 / 2);
console.log(7 % 3);
console.log(2 ** 10);

Çıktılar 10, 4, 21, 3.5, 1 ve 1024. Bölme işlemi tam sayı bölmesi yapmaz, 7 / 2 doğrudan 3.5 verir. % kalan operatörüdür: 7'yi 3'e böldüğünde kalan 1. Bir sayının çift mi tek mi olduğunu anlamanın en kısa yolu da budur; num % 2 sıfırsa sayı çifttir. ** üs alma operatörü ES2016 ile geldi; 2 ** 10, 2'nin 10. kuvveti demek.

Daha önce gördüğümüz gibi + operatörünün ikinci bir görevi var. İki taraftan biri string ise toplama yapmaz, birleştirir. Diğer aritmetik operatörlerde bu yoktur; onlar string'i sayıya çevirmeye çalışır:

console.log("10" + 2);
console.log("10" - 2);
console.log("3" * "4");
console.log(+"42");
console.log(+"hello");

Sırasıyla "102", 8, 12, 42 ve NaN. Önüne tek başına konan +, değeri sayıya çevirmenin kısa bir yoludur; sayıya benzemeyen bir string'den de NaN, yani "sayı değil" sonucu çıkar. Pozitif bir sayıyı sıfıra bölmek ise hata vermez, Infinity döner; bunu sayılar yazısında detaylandıracağız.

Atama, Artırma ve Azaltma

= operatörünü değişkenler yazısından tanıyorsun. Bir değişkeni kendi değeri üzerinden güncellemek o kadar sık yapılır ki bunun kısa yazımları var:

let points = 10;
points += 5;
points -= 3;
points *= 2;
points /= 4;
console.log(points);

Sonuç 6. points += 5, points = points + 5 yazmanın kısa hâlidir; diğerleri de aynı mantıkla çalışır. String'lerde de işe yarar: message += "!" mesajın sonuna ünlem ekler.

Bir artırmak ya da azaltmak için ++ ve -- var. Burada küçük ama önemli bir ayrıntı saklı: operatörün değişkenin önünde mi arkasında mı durduğu.

let n = 5;
const a = n++;
const b = ++n;
console.log(a, b, n);

Çıktı 5 7 7. n++ önce eski değeri verir, sonra artırır; bu yüzden a 5 oldu ve n 6'ya çıktı. ++n ise önce artırır, sonra yeni değeri verir; n 7 oldu ve b de 7'yi aldı. Bu farkla uğraşmamak için çoğu zaman ++'yı tek başına bir satırda kullanmak en okunaklısıdır.

Karşılaştırma: Büyük, Küçük ve Eşit

Karşılaştırma operatörleri her zaman bir boolean döndürür: true ya da false.

console.log(5 > 3);
console.log(5 <= 5);
console.log("pear" < "apple");
console.log("10" < "9");
console.log("10" < 9);

İlk ikisi beklediğin gibi true. Üçüncüsü false, çünkü string'ler sözlük sırasıyla, karakter karakter karşılaştırılır: "p" harfi "a"'dan sonra gelir. Dördüncüsü ise şaşırtıcı biçimde true. İki taraf da string olduğu için motor sayıya bakmaz; ilk karakterleri karşılaştırır ve "1", "9"'dan önce geldiği için "10" küçük çıkar. Beşincide ise taraflardan biri number olduğu için string sayıya çevrilir ve gerçek bir sayı karşılaştırması yapılır: 10, 9'dan küçük değil, sonuç false.

Ders şu: sayı gibi görünen string'leri karşılaştırmadan önce gerçekten sayıya çevir. Bir de büyük harflerin küçük harflerden önce sıralandığını bil; "B" < "a" sorusunun cevabı true.

== ile ===: Coercion'a İlk Bakış

Baştaki son iki satıra gelelim. "5" == 5 sonucu true, "5" === 5 sonucu false.

=== katı eşitliktir: iki değerin hem tipi hem değeri aynıysa true verir. String ile number'ın tipi farklı olduğu için cevap baştan false. == ise gevşek eşitliktir: tipler farklıysa önce birini ya da ikisini dönüştürür, sonra karşılaştırır. Bu otomatik dönüştürmeye coercion denir. "5" == 5'te string sayıya çevrildi, 5 ile 5 karşılaştırıldı.

Bunu iki kapı görevlisine benzetebilirsin. === kimliğe bakar, fotoğraf da isim de tutmalı. == ise "yaklaşık benziyor" diye herkesi içeri alır. Sorun, =='nin benzerlik kurallarının tahmin edilmesi zor olması:

console.log(0 == "");
console.log(0 == "0");
console.log("" == "0");
console.log(null == undefined);
console.log(null == 0);
console.log(NaN == NaN);

Çıktı: true, true, false, true, false, false. İlk üçüne dikkatle bak. 0 hem ""'ye hem "0"'a eşit, ama "" ile "0" birbirine eşit değil. Matematikte bu olmaz; =='de olur. Son satır da ilginç: NaN hiçbir şeye, kendisine bile eşit değildir; === ile de sonuç aynı. Bir değerin NaN olup olmadığını anlamanın doğru yolunu sayılar yazısında göreceğiz.

Kural basit: her zaman === ve !== kullan. Tip dönüşümü gerekiyorsa onu açıkça, kendin yap. Bu sayede kodu okuyan kişi motorun arka planda ne yaptığını tahmin etmek zorunda kalmaz.

Truthy ve Falsy

Mantıksal operatörlere geçmeden önce bir kavrama ihtiyacımız var. JavaScript bir değeri boolean beklenen bir yerde kullandığında onu true ya da false gibi yorumlar. false gibi davranan değerlere falsy, geri kalanlara truthy denir. Falsy listesi kısa ve ezberlemeye değer:

console.log(Boolean(false));
console.log(Boolean(0), Boolean(-0), Boolean(0n));
console.log(Boolean(""));
console.log(Boolean(null), Boolean(undefined));
console.log(Boolean(NaN));

Hepsi false verir. Yani false, 0, -0, 0n, boş string "", null, undefined ve NaN. Bu sekiz değerin dışındaki her şey truthy. Sürpriz olanlar da burada:

console.log(Boolean("0"), Boolean("false"), Boolean(" "));
console.log(Boolean([]), Boolean({}));

Hepsi true. İçinde "0" yazan bir string boş değildir, dolayısıyla truthy'dir. Boş array ve boş object de truthy'dir, çünkü object'tirler ve object'ler her zaman truthy sayılır. Kodda sık göreceğin !!value yazımı da Boolean(value) ile aynı işi yapar; iki kez "değil" deyip değeri saf bir boolean'a çevirir.

&&, || ve !: Kısa Devre

! "değil" demektir ve her zaman boolean döndürür: !true false verir, !"" ise true. && "ve", || "veya" anlamına gelir. Ama JavaScript'te bu ikisi sanıldığından farklı çalışır: boolean değil, operandlardan birinin kendisini döndürürler.

console.log("" || "Guest");
console.log("Ada" || "Guest");
console.log("Ada" && "Welcome");
console.log(null && "Welcome");

Çıktı: Guest, Ada, Welcome, null. || soldan sağa ilk truthy değeri arar ve bulduğu anda onu döndürür; hiçbiri truthy değilse son değeri verir. && ise ilk falsy değeri arar; hepsi truthy ise son değeri verir.

"Bulduğu anda" kısmı önemli. Motor cevabı öğrendiği an durur ve sağ tarafa hiç bakmaz. Buna kısa devre denir. Bir elektrik devresindeki sigorta gibi düşün: akım kesildiğinde devrenin geri kalanına hiçbir şey ulaşmaz.

const isLoggedIn = true;
isLoggedIn && console.log("Loading profile...");

const userName = "";
const displayName = userName || "Guest";
console.log(displayName);

isLoggedIn false olsaydı console.log hiç çalışmazdı. İkinci kısım da bir varsayılan değer kalıbı: kullanıcı adı boşsa "Guest" kullanılıyor. Şimdi baştaki ilk satırı açıklayabiliriz: 0 || "default" sonucu "default", çünkü 0 falsy ve || bir sonraki değere geçti.

??: Sadece Gerçekten Boşsa

|| ile varsayılan değer vermenin bir kusuru var. 0 ve "" de falsy olduğu için, bunlar geçerli bir değer olsa bile yerlerine varsayılan konur:

const quantity = 0;
console.log(quantity || 1);
console.log(quantity ?? 1);

Kullanıcı bilerek 0 adet seçmiş olabilir, ama || bunu 1'e çevirir. ES2020 ile gelen nullish coalescing operatörü ?? bu sorunu çözer: yalnızca sol taraf null ya da undefined ise sağ tarafı kullanır. 0, "" ve false olduğu gibi geçer. İkinci satırın 0 vermesinin nedeni bu, baştaki ikinci sorunun cevabı da öyle: 0 ?? "default" sonucu 0.

Pratik ayrım şöyle: "boş, sıfır ya da yanlış ise varsayılanı kullan" diyorsan ||, "hiç değer yoksa varsayılanı kullan" diyorsan ??. Çoğu zaman aradığın ikincisidir.

Bir de syntax kuralı var: ??'yi parantez olmadan || ya da && ile aynı ifadede kullanamazsın. null || undefined ?? "x" yazarsan SyntaxError alırsın. Hangisinin önce çalışacağını parantezle açıkça söylemen gerekir: (null || undefined) ?? "x".

Operatör Önceliği ve Sık Düşülen Tuzaklar

Bir ifadede birden fazla operatör varsa hangisinin önce çalışacağını öncelik kuralları belirler. Matematikteki gibi çarpma ve bölme toplamadan önce gelir: 2 + 3 * 4 sonucu 14, (2 + 3) * 4 ise 20. Mantıksal tarafta &&, ||'dan önce çalışır. ** ise sağdan sola işler: 2 ** 3 ** 2, önce 3 ** 2 hesaplandığı için 512 verir. Tablonun tamamını ezberlemene gerek yok. Emin olmadığın her yerde parantez kullan; hem doğru çalışır hem okuyan kişiye niyetini anlatır.

Zincirleme karşılaştırma yapmak. 1 < 2 < 3 true verir, ama 3 > 2 > 1 false verir. Motor soldan sağa okur: 3 > 2 sonucu true olur, sonra true > 1 sorulur. true sayıya çevrilince 1'dir ve 1, 1'den büyük değildir. İki karşılaştırmayı && ile bağla: 3 > 2 && 2 > 1.

Negatif sayının üssünü parantezsiz almak. -2 ** 2 yazarsan sonuç 4 ya da -4 değil, SyntaxError olur. Dil, belirsizliği sana çözdürüyor: (-2) ** 2 ya da -(2 ** 2) yaz.

Formdan gelen sayıları toplamak. Kullanıcının yazdığı değerler genellikle string olarak gelir ve "10" + "5" sana "105" verir. Toplamadan önce sayıya çevir.

null ile karşılaştırmaya güvenmek. null == 0 false verir ama null >= 0 true verir, çünkü >= değeri sayıya çevirir, == ise null için özel bir kural uygular. Boş olabilecek bir değeri sayıyla karşılaştırmadan önce boş olup olmadığını ayrıca kontrol et.

Küçük Bir Deneme

★☆☆ Bir sayının çift mi tek mi olduğunu % ile bul ve sonucu konsola yazdır. Aynı şeyi 0, 7 ve -4 için dene.

★★☆ Çalıştırmadan önce her satırın çıktısını tahmin et:

console.log("5" + 1 - 1);
console.log(null ?? 0 || 10);
console.log("" || 0 || "last");
console.log(false === 0, false == 0);

İpucu: bu dört satırı tek seferde yapıştırırsan hiçbiri çalışmaz. Neden? Hangi satırı nasıl düzeltirsen geri kalanı da çalışır?

★★★ stock adında bir değişkenin değeri 0, 5, null ya da undefined olabilir. Değer hiç yoksa (null ya da undefined) konsola "Unknown" yazılsın, 0 ise olduğu gibi 0 yazılsın. Bunu || ile yazınca neden yanlış çalıştığını açıkla, sonra ?? ile doğrusunu yaz ve dört değerle de dene.

Operatörlerin her biri bir soru soruyor ve bir cevap üretiyor. Bir sonraki yazıda bu cevaplarla kararlar vereceğiz: if/else, ternary operatörü ve switch ile kodun hangi yoldan ilerleyeceğini seçeceğiz.