Tüm blog yazıları

JavaScript’te Switch Yapısı

Programlama dünyasında, bir durumun değerine göre farklı işlemler yapmak oldukça yaygındır. Genellikle if, else if ve else yapıları bu iş için kullanılır. Ancak bazen aynı değişkenin birçok farklı değerini kontrol etmemiz ger

eminbasbayan4 dk okuma
JavaScript’te Switch Yapısı

Programlama dünyasında, bir durumun değerine göre farklı işlemler yapmak oldukça yaygındır. Genellikle if, else if ve else yapıları bu iş için kullanılır. Ancak bazen aynı değişkenin birçok farklı değerini kontrol etmemiz gerekir. Bu gibi durumlarda kod kalabalığına yol açmadan daha düzenli bir yapı kullanmak isteriz. İşte burada devreye switch ifadesi girer.

Bu makalede JavaScript’in switch yapısını öğreneceğiz. Konunun mantığını ve kullanım şeklini sade bir dille anlatacağız. Farklı örneklerle konuyu pekiştireceğiz.

1. Switch Yapısı Nedir?

switch, belirli bir değişkenin değerine göre farklı kod bloklarının çalışmasını sağlar. Bu yapı, tek bir değişken için birçok koşul yazmamız gereken durumlarda if/else if zincirine alternatif olarak kullanılır.

Basit Bir Tanım:

Aynı değişkenin birden fazla olasılığı varsa ve her olasılık için farklı bir işlem yapılacaksa, switch kullanmak kodu hem daha sade hem de daha okunabilir hale getirir.

2. Temel Switch Söz Dizimi

jsx
let animal = "cat";

switch (animal) {
  case "dog":
    console.log("Hav hav!");
    break;
  case "cat":
    console.log("Miyav!");
    break;
  case "bird":
    console.log("Cik cik!");
    break;
  default:
    console.log("Tanımadığım bir hayvan!");
}

Açıklama:

  • switch (animal): Kontrol edilecek değişkeni belirtir.
  • case "cat": Eğer animal değişkeni "cat" değerine sahipse bu blok çalışır.
  • break: Bu koddan sonra switch yapısından çıkılır. Yazılmazsa diğer case'ler de çalışabilir (istenmeyen sonuçlar doğurabilir).
  • default: Hiçbir case eşleşmezse bu blok çalışır. Tıpkı else gibi.

3. Break Kullanmanın Önemi

Break yazmazsak, eşleşen case’den sonra gelen tüm case blokları çalışmaya devam eder. Bu davranışa fall-through (aşağıya sarkma) denir.

Örnek – Break Olmadan:

jsx
let color = "yellow";

switch (color) {
  case "red":
    console.log("Dur");
  case "yellow":
    console.log("Dikkat");
  case "green":
    console.log("Geç");
}

Çıktı:

metin
Dikkat
Geç

Burada color değişkeni "yellow" olduğunda sadece "Dikkat" yazması gerekirken "Geç" de yazdırılır. Çünkü break kullanılmamıştır.

4. Default Kullanımı

default bloğu, hiçbir case eşleşmediği durumlarda çalışır.

Örnek:

jsx
let grade = "E";

switch (grade) {
  case "A":
    console.log("Mükemmel");
    break;
  case "B":
    console.log("İyi");
    break;
  case "C":
    console.log("Orta");
    break;
  default:
    console.log("Geçerli bir not girilmedi");
}

Burada "E" notu hiçbir case ile eşleşmediği için default bloğu devreye girer.

5. Aynı Sonucu Veren Birden Fazla Case

Bazen birden fazla değerin sonucu aynı olabilir. Böyle durumlarda case’leri alt alta yazarak tek bir işlem bloğuna yönlendirebiliriz.

Örnek:

jsx
let day = "Saturday";

switch (day) {
  case "Saturday":
  case "Sunday":
    console.log("Hafta sonu");
    break;
  case "Monday":
  case "Tuesday":
  case "Wednesday":
  case "Thursday":
  case "Friday":
    console.log("Hafta içi");
    break;
  default:
    console.log("Geçersiz gün");
}

day değişkeni "Saturday" ya da "Sunday" olduğunda "Hafta sonu" yazdırılır. Hafta içi günleri için ise "Hafta içi" yazılır.

6. Switch ile Sayı Kontrolü

Sadece metinlerle değil, sayılarla da switch kullanılabilir.

Örnek:

jsx
let code = 404;

switch (code) {
  case 200:
    console.log("Başarılı");
    break;
  case 401:
    console.log("Yetkisiz erişim");
    break;
  case 404:
    console.log("Sayfa bulunamadı");
    break;
  default:
    console.log("Bilinmeyen hata kodu");
}

Burada code değeri 404 olduğu için "Sayfa bulunamadı" mesajı ekrana yazdırılır.

7. Switch Ne Zaman Kullanılır?

Kullanılabilir:

  • Aynı değişkenin farklı çok sayıda değeri varsa
  • Her değerin sonucu birbirinden farklıysa
  • Kodun okunabilirliğini artırmak istiyorsan

Tercih Edilmez:

  • Değişkenler arasında karşılaştırma yapman gerekiyorsa (örneğin >, <, !=)
  • Daha karmaşık mantık gerekiyorsa

8. If/Else mi Switch mi?

Her iki yapı da karar vermek için kullanılır. Ancak tercih duruma göre değişir:

DurumTercih
Bir değişkenin sabit değerleriyle karşılaştırma yapılacaksaswitch
Koşullar arasında kıyaslama yapılacaksa (>, <)if / else
Kodun sade ve okunabilir olması gerekiyorsa (çoklu değer kontrolünde)switch

9. Sonuç ve Tavsiyeler

switch yapısı JavaScript’te az ama öz kullanılan bir yapıdır. Çok sık karşına çıkmaz ama bazı özel durumlarda kodun okunabilirliğini ve düzenini artırır. Sadece tek bir değişkenin değeri kontrol edilecekse ve bu değer farklı çıktılar üretmek için kullanılıyorsa, switch oldukça işlevseldir.

Ancak karmaşık ve çok yönlü karşılaştırmalarda if / else yapısı daha esnektir.

Unutma: switch kullanıyorsan her case’in sonuna break yazmayı ihmal etme!

JavaScript Classes ile pratik uygulamalar, metotlar arası iletişim ve gerçek dünya kod örnekleri
JavaScript Dersleri9 dk okuma

JavaScript Classes - Pratik Uygulamalar

JavaScript class'ları ile pratik uygulamalara geçin! Metotlar arası iletişimden constructor'da metot çağırmaya, kod tekrarını azaltmaktan gerçek dünya senaryolarına kadar class kullanımının inceliklerini keşfedin. Kendi alışveriş sepeti örneğinizle bilginizi pekiştirin.

Yazıyı oku
JavaScript class yapısını gösteren bir kod örneği, ES6 ile modern nesne oluşturma
JavaScript Dersleri9 dk okuma

JavaScript Classes

ES6 ile JavaScript'e gelen class yapısı sayesinde nesne oluşturmak artık çok daha kolay ve düzenli! Constructor function karmaşasından kurtulup, okunabilir ve yönetilebilir kodlar yazmak isteyenler için modern JavaScript'in temel taşı olan class'ları tüm detaylarıyla keşfedin. Bu rehberle nesne şabl

Yazıyı oku
JavaScript kodunda Constructor Function ve new keyword'ü ile nesne oluşturma örnekleri
JavaScript Dersleri8 dk okuma

Constructor Functions ve new Keyword

Factory Function'ların hafıza israfı sorununa Constructor Function'lar ve new keyword'ü ile son verin! Metotları paylaştırarak JavaScript objelerini daha verimli nasıl oluşturacağınızı, new'in perde arkasında neler yaptığını ve prototype sisteminin gücünü bu rehberde keşfedin.

Yazıyı oku

Çerez tercihlerin

Platformun çalışması için zorunlu çerezler kullanıyoruz. İzin verirsen anonim kullanım verilerini ölçüyoruz. Ayrıntıları incele