☰

Βρόχοι (Loops)

Με τους βρόχους μπορείτε να εκτελέσετε επαναληπτικά ένα μπλοκ κώδικα.

Στη Javascipt μπορείτε να χρησιμοποιήσετε διαφορετικούς τύπους βρόχου ανάλογα με την περίπτωση.

Ο βρόχος for

Η σύνταξη του βρόχου είναι:

for (αρχική τιμή αριθμητή; συνθήκη; βήμα αρίθμησης) {
	...
}

Ο βρόχος for παίρνει τρεις παραμέτρους οι οποίες χωρίζονται με το ελληνικό ερωτηματικό:

αρχική τιμή αριθμητή: Είναι η τιμή από την οποία αρχίζει να μετράει ο μετρητής π.χ: i=1

συνθήκη: Σε κάθε βρόχο γίνεται έλεγχος της συνθήκης. Αν η συνθήκη ισχύει ο επόμενος βρόχος εκτελείται διαφορετικά τελειώνει η επανάληψη.

βήμα αρίθμησης: Είναι το βήμα με το οποίο μετράει ο μετρητής π.χ.: i=i+5 ή i++

Στο παρακάτω παράδειγμα εκτελείται το μπλοκ κώδικα συνολικά 5 φορές αφού ο μετρητής αρχίζει από το 0 (i=0) τελειώνει στο 4 (i<5) και 'βηματίζει' κατά 1 (i++).

var i;
for (i=0; i<5; i++)
{
	document.write("Ο αριθμός είναι: " + i);
	document.write("<br />");
}

Ο αριθμός είναι: 0
Ο αριθμός είναι: 1
Ο αριθμός είναι: 2
Ο αριθμός είναι: 3
Ο αριθμός είναι: 4

Ο βρόχος while

Η σύνταξη του βρόχου είναι:

while (συνθήκη) {
	...
}

Ο βρόχος while εκτελείται συνέχεια όσο η συνθήκη είναι αληθής

Στο παρακάτω παράδειγμα εκτελείται το μπλοκ κώδικα συνολικά 5 φορές αφού σε κάθε κύκλο (βρόχο) γίνεται έλεγχος της συνθήκης (i<5) η οποία παύει να ισχύει όταν i=5.

var i=0;
while (i<5)
{
	document.write("Ο αριθμός είναι: " + i);
	document.write("<br />");
	i=i+1;
}

Ο αριθμός είναι: 0
Ο αριθμός είναι: 1
Ο αριθμός είναι: 2
Ο αριθμός είναι: 3
Ο αριθμός είναι: 4

Ο βρόχος do...while

Η σύνταξη του βρόχου είναι:

do
{
	...
}
while (συνθήκη);

Ο βρόχος do...while εκτελείται όπως και ο βρόχος while με τη διαφορά ότι ο έλεγχος της συνθήκης γίνεται στο τέλος της εκτέλεσης του μπλοκ και όχι στην αρχή.

var i=0;
do 
{
	document.write("Ο αριθμός είναι: " + i);
	document.write("<br />");
	i=i+1;
}
while (i<5);

Ο αριθμός είναι: 0
Ο αριθμός είναι: 1
Ο αριθμός είναι: 2
Ο αριθμός είναι: 3
Ο αριθμός είναι: 4

Ο βρόχος for...in

Ο βρόχος αυτός χρησιμοποιείται για την διάσχιση ενός πίνακα (array) ή ενός αντικειμένου (object).
Για τους πίνακες και τα αντικείμενα υπάρχουν ξεχωριστές ενότητες.
Η σύνταξη του βρόχου είναι:

for (x in color) {
	...
}

Όπου x είναι μια τυχαία μεταβλητή και color είναι ένας τυχαίος πίνακας ή ένα αντικείμενο (object).

var color = ["red", "green", "blue"];

for (x in color) {
	document.write(color[x]);
	document.write("<br />");
}

red
green
blue

Ο βρόχος forEach()

Η forEach είναι μια μέθοδος του αντικειμένου Array και χρησιμοποιείται για την διάσχιση ενός πίνακα (array).

Η σύνταξη του βρόχου είναι:

Array.forEach(callback);

Όπου callback μια συνάρτηση που καλείται από την forEach

var fruits = ["banana", "apple", "orange", "cherry"];
fruits.forEach(callback);

function callback(item, index) {
	console.log(index + ":" + item); 
}

0:banana
1:apple
2:orange
3:cherry

Συνήθως η συνάρτηση callback καταχωρείται ως ανώνυμη ή arrow function.

const fruits = ["banana", "apple", "orange", "cherry"];
fruits.forEach((item, index) => {
	console.log(index + ":" + item);
});

0:banana
1:apple
2:orange
3:cherry

Ο βρόχος for...of

Χρησιμοποιείται κυρίως για την διάσχιση επαναλήψιμων αντικειμένων (iterable objects) όπως Arrays, Strings, Maps, NodeLists, και άλλα.

const cars = ["BMW", "Volvo", "Fiat"];

for (let x of cars) {
	console.log(x);
}

let language = "JavaScript";

for (let x of language) {
	console.log(x);
}