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

Τι είναι ένας βρόχος στο JavaΓραφή;
Οι βρόχοι είναι χρήσιμοι όταν πρέπει να εκτελέσετε τις ίδιες γραμμές κώδικα επανειλημμένα, για συγκεκριμένο αριθμό φορών ή για όσο διάστημα ισχύει μια συγκεκριμένη συνθήκη. Ας υποθέσουμε ότι θέλετε να πληκτρολογήσετε ένα μήνυμα «Hello» 100 φορές στην ιστοσελίδα σας. Φυσικά, θα πρέπει να αντιγράψετε και να επικολλήσετε την ίδια γραμμή 100 φορές. Αντίθετα, εάν χρησιμοποιείτε βρόχους, μπορείτε να ολοκληρώσετε αυτήν την εργασία σε μόλις 3 ή 4 γραμμές.
Κάθε βρόχος αποτελείται από τα ίδια τρία μέρη, ανεξάρτητα από τη σύνταξη: μια αρχική τιμή, μια συνθήκη που αποφασίζει εάν θα εκτελεστεί ένα άλλο πέρασμα και μια ενημέρωση που μετακινεί τον βρόχο προς την έξοδό του. Το παρακάτω διάγραμμα δείχνει αυτόν τον επαναλαμβανόμενο κύκλο.
Διαφορετικοί τύποι βρόχων σε JavaΓραφή
Υπάρχουν κυρίως τέσσερις τύποι βρόχων JavaΓραφή.
- για βρόχο
- για/σε βρόχο
- ενώ βρόχος
- κάνουμε ... ενώ βρόχο
ΜΟΝΤΕΡΝΑ JavaΤο σενάριο προσθέτει τον βρόχο for…of για την άμεση επανάληψη τιμών, επομένως στην πράξη είναι διαθέσιμες πέντε μορφές. Ο παρακάτω πίνακας δείχνει ποια πρέπει να επιλέξετε σε μια δεδομένη περίπτωση.
| Βρόχος | Ελεγμένη κατάσταση | Ελάχιστες Εκτελέσεις | Χρησιμοποιείται για |
|---|---|---|---|
| για | Πριν από κάθε πέρασμα | 0 | Ένας γνωστός αριθμός επαναλήψεων |
| ενώ | Πριν από κάθε πέρασμα | 0 | Ένας άγνωστος αριθμός που καθορίζεται από μια συνθήκη |
| κάνω…ενώ | Μετά από κάθε πέρασμα | 1 | Μενού και μηνύματα που πρέπει να εκτελεστούν μία φορά |
| για…σε | Πριν από κάθε πέρασμα | 0 | Ανάγνωση των κλειδιών ενός αντικειμένου |
| για… από | Πριν από κάθε πέρασμα | 0 | Ανάγνωση των τιμών ενός πίνακα ή μιας συμβολοσειράς |
για βρόχο
Σύνταξη:
for(statement1; statement2; statment3)
{
lines of code to be executed
}
- Η εντολή1 εκτελείται πρώτη, ακόμη και πριν από την εκτέλεση της εντολής looping κώδικα. Έτσι, αυτή η πρόταση χρησιμοποιείται συνήθως για την ανάθεση τιμών σε μεταβλητές που θα χρησιμοποιηθούν μέσα στον βρόχο.
- Η πρόταση2 είναι η συνθήκη για την εκτέλεση του βρόχου.
- Η εντολή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Γραφή για να αποφασίσουν πού θα κατοικήσει το ολοκληρωμένο σενάριο.

