JavaScript For Döngüsü

Örneklerle JavaScript for Döngüsü

Benzer işleri tekrar tekrar yapmak istediğimizde döngüler bizim yardımımıza koşar. Farklı kullanım amaçları için farklı döngüler geliştirilmiştir. Bunlardan bir taneside for döngüsüdür.

for Döngüsü Nedir?

Aynı işlemi belli bir şart sağlanana kadar yapmak için kullanılan döngü modelidir. Belirtilen şart sağlandığında veya break ifadesi kullanıldığında döngü sona erer. for döngüsü kullanırken bir parametre veririz ve her döngü tekrarında parametre değerini değiştiririz. Bu işlemi yaparken bir şart koşarız, şart sağlandığı sürece döngü devam eder.

Yazım şekli aşağıdaki gibidir.

    for( ifade 1; ifade 2; ifade 3 ) {
        // tekrar tekrar yapılacak işlemler
        // buraya gelecek.
    }

Burada sayac parametresini döngünün ne zaman sona ereceğini denetlemek için kullanıyoruz. for döngüsü içerisinde 3 adet farklı ifade bulunuyor.

  • İlk ifade let sayac = 1 şeklindedir ve bir değişken tanımlar ve ona değer atar. Burada değişken ismini uygun şekilde koyabilirsiniz.
  • İkinci ifade sayac < 50 şeklinde gösterdiğimiz koşul ifadesidir. İlk ifadede tanımladığımız değişken kullanılarak bir koşul olşturulur. Burada farklı şartlar koşabiliriz. Örnek olarak sayac 50 den küçük olduğu sürece döngü devam edecektir. Mesela 50 den büyük oldukça veya mesela 10 değerine eşit olmadığı sürece gibi farklı şartlar kullanabiliriz.
  • Üçüncü ifademiz ise oluşturduğumuz değişkenin değerini değiştirerek döngünün devam etmesini sağladığımız ifadedir. Döngü içerisindeki blok çalıştırıldığında burada kullandığımız ifade devreye girer. Mesela sayac++ diyerek ilk ifadede sayac isminde bir değişken kullandıysak onun değerini artırabiliriz. Yada azaltma yoluna da gidebiliriz. Bu bizim algoritmamıza bağlıdır

for Döngüsü Örnekleri

Konuyu daha iyi anlamak için farklı örnekleri birlikte yapalım. Siz de kendi örneklerinizi geliştirebilirsiniz. Hata yapmaktan korkmayın. Sonuçta hatalar öğrenmenin yolunu açarlar.

for Döngüsü İle 1’den 10’a Kadar Yazdıralım

Şimdi bir örnek ile konuya açıklık getirmek isteyelim. Mesela *1’den 10’a kadar olan sayıları yazdırmak isteyelim. 10 değeri dahil olsun. Bunun için for döngüsünü kullanacağız.

    for(let sayac = 1; sayac <= 10; sayac++) {
        console.log(sayac);
    }

Bu kodları çalıştırdığımızda ekrana 1’den 10’a kadar olan sayılar yazdırılacaktır. Şimdi örneğimizi açıklayalım.

  • İlk olarak let sayac = 1 ifadesi ile for döngüsü için sayac adında bir değişken tanımlıyoruz.
  • İkinci ifademizde sayac <= 10 ifadesi ile sayac değeri 10’dan küçük oldukça döngünün devam etmesini belirtiyoruz. Burada <= ifadesine dikkat edin, 10’a eşit veya 10’dan küçük anlamına geliyor.
  • Üçüncü ifademizde ise sayac++ ifadesi ile döngü işlemi sona erip, döngü bloğundaki kodlar çalıştırıldığında sayac değişkeninin değerini 1 artırıyoruz.

Döngü başladı, sayac = 1 oldu, 1 değeri 10’dan küçük, kodu çalıştır. Kod bitti sayacı 1 artır ve değeri kontrol et, taki sayac 10’dan büyük olana kadar. Eğer sayac 10’dan büyükse döngüyü sona erdir.

Renkler Dizisini Listeleyelim

Farklı bir örnek yapalım. Elimizde renkler dizisi olsun. Bu dizideki renkleri listelemek istediğimizi düşünelim.

    const renkler = ['Beyaz', 'Kırmızı', 'Siyah', 'Yeşil', 'Mavi'];
    const diziBoyutu = renkler.length; // dizinin boyutunu alalım

    for( let i = 0; i < diziBoyutu; i++) {
        console.log(renkler[i]);
    }

Şimdi yaptıklarımızı inceleyelim.

  • Önce renkler dizisini oluşturduk.
  • Sonra length ile dizinin eleman sayısını alarak diziBoyutu değişkenine atıyoruz.
  • for döngüsünü başlatıyoruz ve bir i değişkeni oluşturuyoruz. Bu değişkene 0 değerini atıyoruz. Çünkü bu değişkeni dizi indeksi olarak kullanacağız ve dizi indeksleri 0 dan başlıyor.
  • Şart olarak döngünün dizi eleman sayısı kadar devam etmesi için i < diziBoyutu ifadesini kullanıyoruz. Eğer eleman sayısından fazla bir indeks girersek hata oluşur.
  • Son ifadede i++ ile değişkenimizi 1 artırıyoruz.

console.log(renkler[i]);

İfadesi ile renkler dizininin i değişkeninin o anki değerine ait olan elamanını konsola yazıdırıyoruz. Mesela i değişkeninin değeri 3 ise bu kod “`console.log(renkler[3]);“ olarak yorumlanacaktır.

Tüm renkler listelendikten sonra döngü sona erecektir.

Şehirler Dizisini Listeleyelim

Bu bölümde elimizdeki şehiler dizisini listeleyeceğiz. Farklı olarak dizi elemanları olarak şehir isimlerini ve plaka kodunu tutan bir nesne kullanacağız. Şu şekilde:

    {
        plaka: 41,
        isim: 'İstanbul',
    }

Dizi içerisinde iki özelliği olan şehir nesnesi kullanacağız.

    const sehirler = [
        {
            plaka: '06',
            isim: 'Ankara',
        },
        {
            plaka: '16',
            isim: 'Bursa'
        },
        {
            plaka: '29',
            isim: 'Gümüşhane'
        },
        {
            plaka: '34',
            isim: 'İstanbul'
        },
        {
            plaka: '41',
            isim: 'Kocaeli'
        }

    ];

    // Şehir bilgilerini for döngüsü ile listeleyelim
    const sehirSayisi = sehirler.length;
    for( let i = 0; i < sehirSayisi; i++) {
        console.log(sehirler[i].plaka, ' - ', sehirler[i].isim);
    }
    
    // Çıktı olarak
    06 - Ankara
    16 - Bursa
    29 - Gümüşhane
    34 - Bursa
    41 - Kocaeli
    // sonucunu alacağız

Bu misalimizdeki fark, array içerisinde basit değişkenler değil nesneler bulundurmamız. Aynı özelliklerde olan bir nesne listesi. Nesne özellikleri olarak plaka ve isim bulunmakta.

Yine for döngüsünü normal olarak başlatıyoruz ve i değişkeninin değerini 0 olarak belirliyoruz. Sonra koşulumuzu belirtiyoruz, i değişkeni dizinin eleman sayısından küçük olacak. Eğer şart sağlanıyorsa süslü parantezler içerisindeki for bloğu çalıştırılacak. Sonrasında for döngüsünün üçüncü ifadesi olan i++ çalıştırılarak i değişkeninin değeri 1 artırılacak. Döngü şartı denetnelecek, eğer doğru ise for döngüsü bloğu çalıştırılacak, yanlışsa yani i değişkenin değeri sehir sayısına eşit veya fazla ise döngü sona erecektir.

for Döngüsünden Çıkma – break İfadesi

Bazen döngü devam ederken oluşacak özel bir durumda döngüyü sona erdirmek ve döngüden sonraki satırların çalışmasını sağlamak gerekir. Bu durumda break ifadesini kullanıyoruz. break ifadesi for döngüsü bloğu içerisinde çalıştığında döngü sona erecektir.

break ifadesi genellikle belli bir şart karşılandığında döngüden çıkmak için kullanılır. Bunun için if ile kullanılması yaygındır. Mesela toplam sepet tutarı 1000tlyi aştığında döngünün sona ermesini isteyebiliriz. Bunun için

    if(toplamTutar > 1000) break;

şeklinde bir kod kullanılabilir.

for – break Örneği

Şimdi ilk örneğimizi ufak bir değişiklik ile çalıştıralım.

    for(let sayac = 1; sayac <= 10; sayac++) {
        console.log(sayac);
        break;
    }

    console.log("Döngü sona erdi");
    // Konsola
    // 1
    // Döngü sona erdi
    // yazar ve döngü sona erer

1’den 10’a kadar konsola yazdırdığımız for döngünün içerisinde console.log dan sonra break ifadesi koyduk. for döngüsü ilk çalıştığında şart karşılandığı için for bloğu çalışmaya başlar ve konsola 1 yazılır. Sonra break ifadesi gelir ve döngüyü sona erdirir. Döngü sona erdiğinden dolayı döngü bloğundan sonraki ilk satır ile program çalışmaya devam eder ve konsola Döngü sona erdi yazdırılır ve program biter.

for – continue İfadesi

Döngü içerisinde bazı şartlar oluştuğunda işlem yapmak istemeyebiliriz. Mesela ekrana 1’den 10’a kadar yazdırmak istiyoruz ama 5 değerinin yazılmasını istemiyoruz. Bu gibi durumlarda continue ifadesini kullanıyoruz.

JavaScript motoru bir for döngüsü kod bloğu içerisinde continue ifadesi ile karşılaştığında. Döngünün o anki işlemini sona erdirir ( yani for bloğu içerisindeki işlemi bitirir) ve bir sonraki adıma geçer. Bunun anlamı döngü değişkeninin değerini değiştirilir ve şart kontrol edilir. Eğer şart doğru ise for bloğu tekrar çalıştırılır.

for – continue Örneği

Şimdi 1’den 10’a kadar sayıları konsola yazacağımızı varsayalım. Ama 5 değerini ekrana basmak istemiyoruz.

    for(let sayac = 1; sayac <= 10; sayac++) {
        if( sayac === 5 ) continue;
        console.log(sayac);
    }
    // Konsola
    // 1 2 3 4 6 7 8 9 10
    // yazdırılır.

Daha önce gördüğümüz bu kodda sayılar ekrana 1’den başlayarak yazdırılmaya başlar. Fakat sayac === 5 olduğunda continue ifadesi çalışır ve kod bloğu sona erdirilerek sayac değeri 1 artırılır ve koşul kontrol edilir.

Bu nedenle bu kodumuzda ekrana sadece 1 2 3 4 6 7 8 9 10 yazdırılır. 5 değeri geldiğinde işlem yapılmaz.

Son sözler

Döngüler program yazarken en çok kullandığımız ifadelerdendir. Bunlardan bir tanesi de for döngüsüdür. Bu döngü ile bir değişken tanımlayarak bu değişkenin belirli bir değere ulaşana kadar işlemleri tekrarlayabiliriz. Bu döngüden çıkmak için döngü şartının karşılanmaması veya break ifadesinin kullanılması gerekir. Yine döngü içerisinde belirli şartlar altında kod bloğunun sona erdirilerek döngünün bir sonraki adımına geçmek için continue ifadesi kullanılır.

Siz de konu hakkında bilgilerinizi eklemek veya sorularınızı sormak için yorum yazmayı unutmayın.

Yorum bırakın

E-posta adresiniz yayınlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir