Javascript Notları #2 - Diziler ve Döngüler (Arrays, For-While-ForEach Loops)
Tags: javascript, webdev, frontend, backend
Published: 2021-10-23 09:15:33



Selamlar, serinin ikinci notu ile beraberiz. Bu sefer Javascript programlama dilinde diziler ve döngülerden bahsedeceğiz. Hadi başlayalım :)

## Diziler
Diğer programlama dillerinde olduğu gibi, Javascript'te de dizilerin tanımı oldukça basittir. Aşağıda "diller" isimli dizi tanımlanmıştır:
```
<script>
var diller = ["Java","Python","C","C++"];
</script>
```

Dizi içerisindeki herhangi bir elemana indexi ile ulaşılabilir:
```
<script>
var x = diller[0]; // x'in değeri "Java" olacaktır.
</script>
```

Diziye eleman eklenebilir ya da var olan bir eleman değiştirilebilir:
```
<script>
diller[4] = "Php"; // Dizinin 5. elemanı "Php" olacaktır.
diller[1] = "Ruby"; // Dizinin 2. elemanı Python, Ruby olacaktır.
</script>
```

Dizinin tamamı tek bir satırda yazdırılabilir ya da dizinin uzunluğu aşağıdaki komut sayesinde çekilebilir:
```
<script>
alert(array); // Dizinin tamamı yazdırılır.
alert(array.length); // Dizinin uzunluğu yazdırılır.
</script>
```

## Döngüler
### For Döngüsü
For döngüsü, yapılacak işin adım sayısı (uzunluğu) belli ise kullanılır. Yani 100'e kadar olan tek sayıları yazdırma buna örnek olarak verilebilir. For döngüsü tanımlama aşağıdaki gibidir:
```
<script> // 10'a kadar olan sayıları konsola yazdırma
for (var i =0; i <10;  i++)  { 
            console.log("i'nin değeri = " + i);
         }
</script>
```

### While Döngüsü
While döngüsü, bir iş herhangi bir koşula bağlı şekilde belli süre boyunca devam ettirilecekse kullanılır. Bu döngüye "fonksiyon True dönene kadar şu işi yap" örnek olarak verilebilir. While döngüsünün basit syntax'ı aşağıdaki gibidir:

```
<script> // 10'a kadar olan sayıları konsola yazdırma
var i = 0;
while (i < 10) {
     console.log("i'nin değeri = " + i);
     i += 1; // Ya da "i = i + 1;"
}
</script>
```

Dizi elemanlarını tek tek elle yazdırmak çok zahmetli bir iş olurdu. Bu iş için döngülerden yardım alabiliriz.

## Dizilerin For Döngüsü ile Yazdırılması
Aşağıdaki örnekte dizinin elemanlarının for döngüsü ile konsola yazdırıldığını görmekteyiz:

```
<script> 
var sayilar = [10,5,0,25,-15,75,65,-30]; // sayilar dizisi
console.log("Array Elemanları..."); // başlığın yazdırılması
for (var i=0; i < sayilar.length; i++){
console.log((i + 1) + ". eleman: " + sayilar[i]);
}
</script>
```
Bu örneğin ekran çıktısı aşağıdaki gibidir:
![For döngüsü ile dizi yazdırma](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/tmcy6opv9r7sf50vxmwb.png)

## Dizilerin While Döngüsü ile Yazdırılması
Aşağıdaki örnekte dizinin elemanlarının while döngüsü ile konsola yazdırıldığını görmekteyiz:
```
<script> 
var sayilar = [10,5,0,25,-15,75,65,-30]; // sayilar dizisi
var i = 0;
while (i < sayilar.length) {
    console.log((i+1) + ". eleman: " + sayilar[i]);
    i += 1; // ya da "i = i + 1";
}
</script>
```
Bu örneğin ekran çıktısı aşağıdaki gibidir:
![While döngüsü ile dizi yazdırma](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/xrn6ukrpcnet55ciytjo.png)
 
## Dizilerin ForEach Döngüsü ile Yazdırılması
ForEach döngüsü, diziler için oluşturulmuş özel döngülerdir. Dizi içerisindeki her elemana erişmek ve ona göre işlem yapmak için kullanılır. Aşağıda ForEach'e bir örnek verilmiştir:
```
<script> 
var sayilar = [10,5,0,25,-15,75,65,-30];
sayilar.forEach(function(sayi) {
    console.log("Eleman: " + sayi)
});
</script>
```
Bu örneğin ekran çıktısı aşağıdaki gibidir:
![Foreach döngüsü ile dizi yazdırma](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/c94bcjtml0cdmgbtmcqg.png)
 
Böylelikle dizi ve döngü kavramlarını genel olarak anlamış bulunmaktayız. Daha önceden de belirtildiği üzere bunlar sadece simple-basic örnekler ve tanımlar. Bu kavramlar ile ilgili keşfedilmesi gereken çok daha fazla fonksiyon, kullanım ve kısayol bulunmakta. İyi çalışmalar :)