Kasvetli bir pazartesi ve siz iştesiniz. Pazartesi günlerinin ne kadar bunaltıcı olabileceğini hepimiz biliyoruz, değil mi? Patronunuz size yaklaşıyor ve şöyle diyor: "Hey, hafta sonu boyunca aldığımız 300 açılmamış e-posta var. Her birini açmanızı, gönderenin adını yazmanızı ve işiniz bittiğinde e-postaları silmenizi istiyorum."
Bu görevi manuel olarak yapmaya çalışırsanız çok yorucu görünüyor. Aklınıza gelen bir sonraki şey muhtemelen Google'a girip bu süreci otomatikleştirecek ve hayatınızı kolaylaştıracak bir yazılım aramaktır, değil mi?
Programlamada da benzer durumlarımız var. Tekrarlanan görevleri tamamlanana kadar gerçekleştirmeniz gereken zamanlar vardır. Bu sorunu nasıl çözersiniz? JavaScript'te döngüler dediğimiz şeylere sahibiz. Döngüler, görevi tamamlamak için gereken kod miktarını azaltarak tekrarlanan görevleri çözmemize olanak tanır.
Bu makalede döngünün ne olduğunu, nasıl çalıştığını ve onu programlarımıza uygulamak için kullanabileceğimiz çeşitli yöntemleri tartışacağız.
Döngüler, JavaScript'te tekrarlanan eylemleri kolayca gerçekleştirmek için kullanılır. Doğru veya yanlış döndüren bir koşula dayanırlar.
Koşul, bir döngünün çalışmaya devam etmesi için iletilmesi gereken bir ifadedir. Belirtilen koşullar doğru bir değer döndürdüğünde döngü çalışır ve yanlış bir değer döndürdüğünde durur.
Döngüler tekrarlanan görevleri gerçekleştirmek için kullanışlıdır. Örneğin döngü kullanmak, bir sorunu çözmek için gereken kodu kısaltır. Zamandan tasarruf sağlar, bellek kullanımını optimize eder ve esnekliği artırır.
Bir döngünün gerçek önemi, kod uzunluğunu kısaltmanın ve tekrarı sınırlamanın ötesine uzanır. Ayrıca bir dizi, nesne veya diğer yapılardaki verilerle çalışırken de yardımcı olurlar. Üstelik döngüler, tekrarlanan kodu azaltarak ve kodun yeniden kullanılabilirliğini artırarak kod modülerliğini destekler; bu da projenizin farklı bölümlerinde kullanılabilecek kodlar oluşturmayı mümkün kılar.
Döngülerin iki ana kategorisi vardır: giriş kontrollü döngüler ve çıkış kontrollü döngüler.
Giriş kontrollü döngüler, döngünün gövdesini çalıştırmadan önce "döngü girişindeki" durumu değerlendirir. Koşul doğruysa vücut çalışır. Aksi halde vücut çalışmaz. for
ve while
döngüleri giriş kontrollü döngülere örnektir.
Çıkış kontrollü döngüler, test koşulu boyunca döngünün gövdesine odaklanır ve test koşulu değerlendirilmeden önce döngü gövdesinin en az bir kez çalıştırılmasını sağlar. Çıkış kontrollü döngüye iyi bir örnek do-while
döngüsüdür.
Giriş kontrollü döngülerin bazı örneklerini inceleyelim:
Bir while
döngüsü aşağıdaki sözdizimine sahiptir.
while (condition) { // loop's body }
Aşağıdaki listede while döngüsünün işlevselliği açıklanmaktadır:
while
döngüsü parantez içindeki bir test koşulunu alır.
Program koşulun geçip geçmediğini kontrol eder.
Döngünün gövdesindeki kod, koşul iletildiği sürece yürütülür.
Test koşulu başarısız olduğunda program çalışmasını sonlandırır.
Aşağıda while while
pratik bir örneğini ele alalım:
let arr = []; let i = 1; let number = 5; while (i <= number) { arr.push(i) i++ } console.log(arr)
Yukarıdaki kod parçacığı "arr", "i" ve "num" değişkenlerini başlatır.
" arr" değişkeni, test koşulunu geçen değerleri tutan bir dizidir.
"i" değişkeni, her yinelemeden sonraki her artışın kaydını tutar.
"Sayı" değişkeni, her yinelemeden sonra "i" değerini değeriyle (5) karşılaştırır.
Döngünün gövdesindeki kod, "i" "sayı"dan küçük veya ona eşit olduğu sürece her yinelemeden sonra "i"nin her değerini diziye iter.
"i"nin mevcut değeri koşulu sağlayamadığında, "i" nin değerinin 6 olan "sayı" dan büyük olduğu bu durumda döngünün çalışması durur.
push()
yöntemi, bir dizinin sonuna yeni bir öğe ekleyen yerleşik bir JavaScript işlevidir.
Çıktı
[1, 2, 3, 4, 5]
Bir do-while
döngüsü, while döngüsüne çok benzer; while
ile do-while
döngüsü arasındaki temel fark do-while
döngüsünün, döngünün durumunu değerlendirmeden önce en az bir kez kod yürütülmesini sağlamasıdır; do-while
döngüsü aşağıdaki sözdizimine sahiptir.
do { // loop's body } while (//condition)
do-while
çıkış kontrollü döngünün mükemmel bir örneğidir. Bunun nedeni, çıkış kontrollü döngülerin test koşulundan önce döngünün gövdesine öncelik vermesidir. Şimdi do-while
döngüsünü kullanan pratik bir kod örneğine bakalım.
Örnek:
let i = 1; let num = 5; do { console.log(i); i++; } while (i <= num);
Şimdi bu kod parçasını parçalayalım:
"i" ve "num" değişkenlerini başlattık.
Konsol, döngünün durumunu değerlendirmeden önce "i" (1) değerini kaydeder.
Koşul kontrol edilir ve her yinelemeden sonra "i"nin değeri +1 artar.
Döngü, "i" değeri "num" değerinden büyük olduğunda işlemi sonlandırır.
Çıktı
1 2 3 4 5
Her ne kadar do-while
döngüsü while
döngüsüne çok benzese de, dikkat etmemiz gereken ince farklar vardır; while
ve do-while
döngüsü arasındaki farkı karşılaştıran başka bir örneği ele alalım.
let i = 5; let num = 4 while( i < num) { console.log(i) }
Yukarıdaki while
döngüsü konsola herhangi bir sonuç döndürmez; şimdi bu neden böyle?
"i" ve "num" değişkenlerini sırasıyla 5 ve 4 değerleriyle başlattık.
Koşul, "i" değerinin "num"dan küçük olup olmadığını kontrol eder.
Doğruysa, ilgili her değerde günlüğe kaydedilir.
"i"nin başlangıç değeri "num"unkini aştığı için döngü asla çalışmaz.
Şimdi do-while
döngüsüyle benzer bir örnek ele alalım.
let i = 5; let num = 4; do { console.log(i) } while ( i < num)
Çıktı
5
do-while
döngüsü, konsola 5 değerini döndüren kod bloğunun yürütülmesini sağlar, ancak "i" başlangıçta "num"dan daha yüksek bir değere sahip olsa da yine de konsolda bir kez oturum açılmıştır. Bu gösterim size do-while
ve while
döngüsü arasındaki işlevsellik farkını gösterir.
for loop
benzersiz bir döngü türüdür ve programcılar tarafından en sık kullanılan döngülerden biridir; for loop
bir koşula bağlı olarak bir kod bloğunu belirli sayıda çalıştıran bir döngüdür. For döngüsü aşağıdaki sözdizimine sahiptir.
for (Expression1...; Expression2....; Expression3...{ //code block }
İfade 1: for loop
bu kısmı aynı zamanda başlatma alanı olarak da bilinir; for loop
başlangıcı ve sayaç değişkeninin tanımlandığı alandır. Sayaç değişkeni, döngünün kaç kez çalıştığını izlemek ve bunu bir değer olarak saklamak için kullanılır.
İfade 2: Bu döngünün ikinci kısmıdır; bu bölüm döngüyü yürütecek koşullu ifadeyi tanımlar.
İfade 3: Döngünün bittiği yer burasıdır; bu bölümdeki sayaç değişkeni, her yinelemeden sonra değeri koşulda belirtildiği şekilde artırarak veya azaltarak değerini günceller.
For döngüsünü kullanarak bir örneğe bakalım.
for (let i = 0; i < 100; i++) { console.log("Hello World" ) }
Yukarıdaki kod parçacığını birlikte parçalayalım.
Öncelikle " i" sayaç değişkenini sıfır değeriyle başlattık.
Daha sonra kodun çalışır durumda kalmasını sağlayacak koşullu ifadeyi oluşturduk.
"i" değerini 100 ile karşılaştırdık; bu testi geçerse "Merhaba Dünya" günlüğe kaydedilir.
Bu işlem, her yinelemeden sonra sayaç +1 oranında artarken tekrarlanır.
Sayacın değeri 100'e ulaştığında döngü sona erer.
Çıktı
Hello World Hello World Hello World ... //repeated 97 more times making it 100 "Hello World" in total ...
for-each
döngüsü, JavaScript'te bir dizi boyunca dolaşan ve o dizideki her öğeye bir geri çağırma işlevi uygulayan bir yöntemdir; geri çağırma işlevi, bir işleve parametre olarak iletilen başka bir işlevdir. Geri çağırma işlevi, ana işlevin yürütülmesi tamamlandıktan sonra sırayla çalıştırılarak çalışır.
for-each
döngüsünün temel sözdizimini inceleyelim.
array.forEach(function(currentValue, index, arr))
Yukarıda verilen kod for-each
döngüsünün çalışmasını açıklamaktadır.
arr, öğenin hangi diziye ait olduğunu söyleyen isteğe bağlı başka bir parametredir.
let myArray = [1, 2, 3, 4, 5]; array.forEach((num, index, arr) => { arr[index] = num * 2; console.log(array); });
Yukarıdaki örneği parçalayalım:
"myArray" değişken adında bir dizi başlattık ve onu 1'den 5'e kadar tamsayılarla sakladık.
for-each
array yöntemi üç parametre alır ve diziye bir geri çağırma işlevi uygular.
Bu hat; arr[index] = num * 2
geçerli öğenin değerini 2 ile çarpar ve döndürülen değeri geçerli öğenin dizinine atar.
Dikkat edin: for-each
array yöntemi yeni bir dizi döndürmez; bunun yerine orijinal diziyi değiştirir ve onu döndürür.
Çıktı
[2, 4, 6, 8, 10]
Tekrarlanabilir nesneler üzerinde yineleme söz konusu olduğunda for... in
ve for... of
döngüleri çok kullanışlıdır; yinelenebilir nesneler, üzerinde döngü yapılabilen herhangi bir öğeyi ifade eder; yinelenebilir nesnelerin yaygın örnekleri diziler, dizeler, kümeler vb.'dir.
for... in
ve for... of
nesneleri yineleme/hareket etme biçimleri bakımından benzerdir; aralarındaki temel fark, değerleri nasıl döndürdüklerinde gösterilir.
Bir for... in
döngüsü, bir nesneden anahtar(lar)ı/özellikleri ve ona karşılık gelen özellikleri ana nesneden çıkarmanız gerektiğinde kullanışlıdır. for... in
döngüsü zaman zaman bir nesneyi, söz konusu nesnede tanımlandığı şekilden farklı bir şekilde yineleyebilir; hadi eylem halindeki for... in
döngüsünün bir örneğini ele alalım.
let namesArray = []; const studentScores = { John: 60, Dan: 53, Tricia: 73, Jamal: 45, Jane: 52 } for(const name in studentScores){ namesArray.push(name); } console.log(namesArray);
Yukarıdaki örnekte, çeşitli öğrenci adlarını ve bunlara karşılık gelen puanları içeren studentScores adında bir nesne tanımladık. for... in
kullanarak, yalnızca studentScores nesnesinin anahtarlarını temsil eden öğrencilerin adlarını alabildik ve push()
yöntemini kullanarak bunları bir dizide saklayabildik.
Çıktı
["John", "Dan", "Tricia", "Jamal", "Jane"]
for... of
döngüsü, diziler, dizeler, haritalar vb. gibi yinelenebilir nesnelerin değerleri üzerinde yinelenen özel bir döngü türüdür; for... of
döngüleri, bir nesnenin anahtarları veya özellikleriyle ilgilenmez. bunun yerine yalnızca değerlere göre öncelikleri gösterirler.
for... of
döngüsü normal nesneler üzerinde yineleme yapamaz ve yinelenemedikleri için hata verir. for.. of
döngüsünü kullanarak bir örnek alalım.
let numArray = [1,2,3,4,5] for (const value of numArray) { console.log(value) } // Output = 1,2,3,4,5
Özetle, for... in
ve for... of
döngüleri yinelenebilir nesneler arasında döngü yapmanın harika bir yoludur; temel fark, for... in
döngüsünün bir Nesnenin anahtarını döndürmesi, for... of
döngüsünün ise yalnızca yinelenebilir nesnelerin değerlerini döndürmesidir.
Sonsuz döngü, süresiz olarak çalışmaya devam eden bir döngüyü ifade eder; bu, bir döngünün tanımlı bir çıkış koşulu olmadığında meydana gelir. Sonsuz döngüler tehlikelidir çünkü tarayıcınızı çökertebilir ve programınızda istenmeyen eylemlere yol açabilirler.
// infinite loop sample while (true) { console.log("keep on running") }
Programınızda sonsuz döngüleri önlemek için her zaman döngünüzde tanımlanmış bir çıkış koşulunun olduğundan emin olun.
Bu makalenin sonuna geldiğiniz için çok teşekkür ederiz. Javascript'teki döngüler, iyi ve optimize edilebilir bir program oluşturmak için çok değerli olduğundan, her geliştiricinin uzmanlaşması gereken önemli bir kavramdır. Bu makaleyle programınızda döngü kullanmanın temellerini ve inceliklerini anlayabileceğinize inanıyorum.