For, while και Do while LOOP in JavaΣενάριο με παράδειγμα

⚡ Έξυπνη Σύνοψη

Οι βρόχοι For, While και Do While εντάσσονται σε επαναλήψεις. JavaΤο σενάριο επαναλαμβάνει ένα μπλοκ εντολών χωρίς να αντιγράφει κώδικα. Αυτό το άρθρο εξηγεί κάθε σύνταξη, δείχνει εκτελέσιμα παραδείγματα με αναμενόμενη έξοδο, προσθέτει τις φόρμες for-in και for-of και καλύπτει την αποτροπή διακοπής, συνέχειας και ατέρμονου βρόχου.

  • 🔁 Βασικός Σκοπός: Ένας βρόχος εκτελεί τις ίδιες εντολές επανειλημμένα για ένα σταθερό πλήθος ή όσο μια δηλωμένη συνθήκη παραμένει αληθής.
  • 🔢 για τον βρόχο: Τρεις εκφράσεις στην κεφαλίδα χειρίζονται την αρχικοποίηση, τη δοκιμή εξόδου και την ενημέρωση, η οποία ταιριάζει σε έναν γνωστό αριθμό επαναλήψεων.
  • βρόχος while: Η συνθήκη ελέγχεται πριν από κάθε πέρασμα, επομένως το σώμα ενδέχεται να μην εκτελεστεί ποτέ εάν η συνθήκη ξεκινήσει ως ψευδής.
  • 1️⃣ κάνω…ενώ βρόχος: Το σώμα τρέχει πάντα τουλάχιστον μία φορά επειδή η κατάσταση αξιολογείται μετά το πρώτο πέρασμα.
  • 🔑 για…σε βρόχο: Επαναλαμβάνει τα κλειδιά ενός αντικειμένου, επιστρέφοντας ονόματα ιδιοτήτων αντί για τιμές.
  • 📦 για…του βρόχου: Επαναλαμβάνει τις τιμές πινάκων, συμβολοσειρών, χαρτών και άλλων επαναλήψιμων αντικειμένων.
  • Έλεγχος ροής: Η εντολή break τερματίζει αμέσως έναν βρόχο, ενώ η εντολή continue μεταβαίνει στην επόμενη επανάληψη.

Για While και Κάντε επανάληψη While JavaΓραφή

Τι είναι ένας βρόχος στο JavaΓραφή;

Οι βρόχοι είναι χρήσιμοι όταν πρέπει να εκτελέσετε τις ίδιες γραμμές κώδικα επανειλημμένα, για συγκεκριμένο αριθμό φορών ή για όσο διάστημα ισχύει μια συγκεκριμένη συνθήκη. Ας υποθέσουμε ότι θέλετε να πληκτρολογήσετε ένα μήνυμα «Hello» 100 φορές στην ιστοσελίδα σας. Φυσικά, θα πρέπει να αντιγράψετε και να επικολλήσετε την ίδια γραμμή 100 φορές. Αντίθετα, εάν χρησιμοποιείτε βρόχους, μπορείτε να ολοκληρώσετε αυτήν την εργασία σε μόλις 3 ή 4 γραμμές.

Κάθε βρόχος αποτελείται από τα ίδια τρία μέρη, ανεξάρτητα από τη σύνταξη: μια αρχική τιμή, μια συνθήκη που αποφασίζει εάν θα εκτελεστεί ένα άλλο πέρασμα και μια ενημέρωση που μετακινεί τον βρόχο προς την έξοδό του. Το παρακάτω διάγραμμα δείχνει αυτόν τον επαναλαμβανόμενο κύκλο.

Χρησιμοποιήστε το Loops in Javascript

Διαφορετικοί τύποι βρόχων σε JavaΓραφή

Υπάρχουν κυρίως τέσσερις τύποι βρόχων JavaΓραφή.

  1. για βρόχο
  2. για/σε βρόχο
  3. ενώ βρόχος
  4. κάνουμε ... ενώ βρόχο

ΜΟΝΤΕΡΝΑ JavaΤο σενάριο προσθέτει τον βρόχο for…of για την άμεση επανάληψη τιμών, επομένως στην πράξη είναι διαθέσιμες πέντε μορφές. Ο παρακάτω πίνακας δείχνει ποια πρέπει να επιλέξετε σε μια δεδομένη περίπτωση.

Βρόχος Ελεγμένη κατάσταση Ελάχιστες Εκτελέσεις Χρησιμοποιείται για
για Πριν από κάθε πέρασμα 0 Ένας γνωστός αριθμός επαναλήψεων
ενώ Πριν από κάθε πέρασμα 0 Ένας άγνωστος αριθμός που καθορίζεται από μια συνθήκη
κάνω…ενώ Μετά από κάθε πέρασμα 1 Μενού και μηνύματα που πρέπει να εκτελεστούν μία φορά
για…σε Πριν από κάθε πέρασμα 0 Ανάγνωση των κλειδιών ενός αντικειμένου
για… από Πριν από κάθε πέρασμα 0 Ανάγνωση των τιμών ενός πίνακα ή μιας συμβολοσειράς

για βρόχο

Σύνταξη:

for(statement1; statement2; statment3)
{
lines of code to be executed
}
  1. Η εντολή1 εκτελείται πρώτη, ακόμη και πριν από την εκτέλεση της εντολής looping κώδικα. Έτσι, αυτή η πρόταση χρησιμοποιείται συνήθως για την ανάθεση τιμών σε μεταβλητές που θα χρησιμοποιηθούν μέσα στον βρόχο.
  2. Η πρόταση2 είναι η συνθήκη για την εκτέλεση του βρόχου.
  3. Η εντολή3 εκτελείται κάθε φορά μετά την τουαλέταping εκτελείται ο κώδικας.

Δοκιμάστε αυτό μόνοι σας:

<html>
<head>
	<script type="text/javascript">
		var students = new Array("John", "Ann", "Aaron", "Edwin", "Elizabeth");
		document.write("<b>Using for loops </b><br />");
		for (i=0;i<students.length;i++)
		{
		document.write(students[i] + "<br />");
		}
	</script>
</head>
<body>
</body>
</html>

Παραγωγή:

Using for loops
John
Ann
Aaron
Edwin
Elizabeth

Ο μετρητής ξεκινά από το 0 επειδή ο πρώτος δείκτης ενός παράταξη είναι μηδέν και η συνθήκη χρησιμοποιεί το students.length, επομένως ο βρόχος προσαρμόζεται αυτόματα όταν προστίθενται ή αφαιρούνται ονόματα.

ενώ βρόχος

Σύνταξη:

while(condition)
{
lines of code to be executed
}

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

Δοκιμάστε αυτό μόνοι σας:

<html>
<head>
	<script type="text/javascript">
		document.write("<b>Using while loops </b><br />");
		var i = 0, j = 1, k;
		document.write("Fibonacci series less than 40<br />");
		while(i<40)
		{
			document.write(i + "<br />");
			k = i+j;
			i = j;
			j = k;
		}
	</script>
</head>
<body>
</body>
</html>

Παραγωγή:

Using while loops
Fibonacci series less than 40
0
1
1
2
3
5
8
13
21
34

⚠️ Προειδοποίηση: Ένας βρόχος while του οποίου η συνθήκη δεν γίνεται ποτέ false παγώνει την καρτέλα του προγράμματος περιήγησης. Να επιβεβαιώνετε πάντα ότι μια μεταβλητή μέσα στο σώμα μετακινεί τη συνθήκη προς το false και να χρησιμοποιείτε έναν μετρητή ασφαλείας όταν η έξοδος εξαρτάται από εξωτερικά δεδομένα.

κάνουμε ... ενώ βρόχο

Σύνταξη:

do
{
block of code to be executed
} while (condition)

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

Δοκιμάστε αυτό μόνοι σας:

<html>
<head>
	<script type="text/javascript">
		document.write("<b>Using do...while loops </b><br />");
		var i = 2;
		document.write("Even numbers less than 20<br />");
		do
		{
			document.write(i + "<br />");
			i = i + 2;
		}while(i<20)
	</script>
</head>
<body>
</body>
</html>

Παραγωγή:

Using do...while loops
Even numbers less than 20
2
4
6
8
10
12
14
16
18

Η διαφορά γίνεται ορατή όταν η συνθήκη είναι ψευδής εξαρχής. Ένας βρόχος while δεν εκτυπώνει τίποτα, ενώ ένας βρόχος do…while εξακολουθεί να εκτυπώνει μία γραμμή πριν από το stop.ping.

για…σε βρόχο

Ο βρόχος for…in διατρέχει τα απαριθμήσιμα ονόματα ιδιοτήτων ενός αντικειμένου. Κάθε πέρασμα αντιστοιχίζει το επόμενο κλειδί στη μεταβλητή βρόχου και η τιμή διαβάζεται με τη μορφή παρενθέσεων.

const student = {
    name: "Ann",
    age: 21,
    course: "JavaScript"
};

for (const key in student) {
    console.log(key + " : " + student[key]);
}

Παραγωγή:

name : Ann
age : 21
course : JavaScript

💡 Συμβουλές: Αποφύγετε τη συνάρτηση for…in σε πίνακες. Επιστρέφει τιμές ευρετηρίου ως συμβολοσειρές και επίσης επισκέπτεται κληρονομημένες ιδιότητες, οι οποίες μπορούν να παράγουν εκπληκτικά αποτελέσματα. Χρησιμοποιήστε αντ' αυτού τη συνάρτηση for…of ή έναν κλασικό βρόχο for για πίνακες.

για…του βρόχου και για κάθε

Ο βρόχος for…of διαβάζει τις τιμές οποιουδήποτε επαναλήψιμου αντικειμένου, συμπεριλαμβανομένων πινάκων, συμβολοσειρών, χαρτών και συνόλων. Η μέθοδος forEach επιτυγχάνει το ίδιο αποτέλεσμα με μια συνάρτηση επανάκλησης και παρέχει πρόσβαση στο ευρετήριο.

const students = ["John", "Ann", "Aaron"];

// for...of reads each value directly
for (const name of students) {
    console.log(name);
}

// forEach supplies the value and the index
students.forEach(function (name, index) {
    console.log(index + " - " + name);
});

// strings are iterable too
for (const letter of "Ann") {
    console.log(letter);
}

Παραγωγή:

John
Ann
Aaron
0 - John
1 - Ann
2 - Aaron
A
n
n

Μία πρακτική διαφορά έχει σημασία: διακόπτουν και συνεχίζουν την εργασία μέσα στο for…of, αλλά δεν μπορούν να χρησιμοποιηθούν μέσα στο forEach, επειδή κάθε επανάκληση είναι μια ξεχωριστή συνάρτηση.

Δηλώσεις break και continue

Δύο λέξεις-κλειδιά αλλάζουν την κανονική ροή οποιουδήποτε βρόχου. Η εντολή break εγκαταλείπει εντελώς τον βρόχο και η εντολή continue εγκαταλείπει το τρέχον πέρασμα και μεταβαίνει στο επόμενο.

const numbers = [4, 7, 10, 13, 16, 19];

// continue: skip odd numbers
for (const n of numbers) {
    if (n % 2 !== 0) {
        continue;
    }
    console.log("even: " + n);
}

// break: stop at the first value above 12
for (const n of numbers) {
    if (n > 12) {
        console.log("first value above 12: " + n);
        break;
    }
}

Παραγωγή:

even: 4
even: 10
even: 16
first value above 12: 13

Οι βρόχοι εμφανίζονται σχεδόν σε κάθε σενάριο που θα γράψετε. Συνεχίστε με το πρακτικός JavaΠαραδείγματα κώδικα σεναρίου, επανεξέταση JavaΜέθοδοι πίνακα σεναρίων για τους βοηθούς επανάληψης που δημιουργήθηκαν πάνω σε αυτούς τους βρόχους και διαβάστε εσωτερικός και εξωτερικός JavaΓραφή για να αποφασίσουν πού θα κατοικήσει το ολοκληρωμένο σενάριο.

Συχνές Ερωτήσεις

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

Ναι. Ένας εσωτερικός βρόχος ολοκληρώνει κάθε πέρασμα για κάθε μεμονωμένο πέρασμα του εξωτερικού βρόχου, και έτσι κατασκευάζονται τα πλέγματα και οι πίνακες. Χρησιμοποιήστε διαφορετικά ονόματα μετρητών για να αποφύγετε την αντικατάσταση του εξωτερικού ευρετηρίου.

Κλείστε την καρτέλα που επηρεάζεται και, στη συνέχεια, διορθώστε τη συνθήκη ή την εντολή ενημέρωσης πριν από την επαναφόρτωση. Η προσθήκη ενός μετρητή που διακόπτεται μετά από έναν μέγιστο αριθμό περασμάτων αποτρέπει την επανάληψη κατά την ανάπτυξη.

Η κλασική επανάληψη for είναι οριακά ταχύτερη σε μεγάλους πίνακες επειδή αποφεύγει την επιβάρυνση επανάκλησης. Η διαφορά είναι αμελητέα κάτω από μερικές χιλιάδες στοιχεία, επομένως προτιμήστε την αναγνωσιμότητα.

Συνήθως έχουν ως προεπιλογή για…από ή χάρτη. RevΔείτε την πρόταση όταν η εργασία χρειάζεται ευρετήριο, πρόωρη έξοδο ή εγγυημένο πρώτο πέρασμα, καθώς αυτές οι περιπτώσεις απαιτούν διαφορετική μορφή.

Ένας βρόχος for await…of διαβάζει κομμάτια από μια ροή απόκρισης και προσαρτά κάθε διακριτικό στη σελίδα. Είναι το ασύγχρονο αντίστοιχο του for…of και απαιτεί μια ασύγχρονη συνάρτηση.

Συνοψίστε αυτήν την ανάρτηση με: