while

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

Γενικώς η «while» χρησιμοποιείται σε περιπτώσεις που δεν γνωρίζουμε για πόσες επαναλήψεις θα απαιτηθούν για να γίνει η συνθήκη ψευδής. Δεν ξεχνάμε να ορίσουμε την μεταβλητή που αντιπροσωπεύει τον μετρητή, πριν από το «while», όπως επίσης δεν ξεχνάμε να αυξήσουμε η μειώσουμε τον μετρητή μέσα στο «while», αλλιώς θα καταλήξουμε σε ατέρμονο βρόγχο.

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

var μετρητής = τιμή;
while(συνθήκη){
 ...εντολές προς επανάληψη...
 μετρητής++;
}
  • Όπου «var μετρητής = τιμή» πηγαίνει το όνομα του μετρητή μας, και μια αρχική τιμή γι αυτόν.
  • Όπου «συνθήκη», η συνθήκη που θέλουμε για όσο ισχύει να επαναλαμβάνονται οι «εντολές προς επανάληψη».
  • Όπου «μετρητής++» ο μετρητής μας αυξάνεται κατά μια μονάδα, θα μπορούσε επίσης να μειώνεται ή να γίνεται οποιαδήποτε πράξη ανάθεσης τιμής. 

Ας υποθέσουμε πως εισάγουμε έναν αριθμό και θέλουμε από το 1 έως και τον αριθμό που θα εισάγουμε, να τυπώσει (στην κονσόλα) κατά σειρά όλους τους αριθμούς.

Αρχείο: while.html

<!DOCTYPE HTML>
<html>
 <head>
  <meta charset="utf-8">
  <title>Δοκιμή της while</title>
  <script type='text/javascript'>
   function nums_ins(x){
    var i = 1;
    while(i<=x){
     console.log(i);
     i++;
    }
   }
  </script>
 </head>
 <body>
  Εισάγετε έναν αριθμό:
  <input type='text' name='temp' id='temp' onchange='nums_ins(this.value);'>
 </body>
</html>

Αποτέλεσμα:

Όπως μπορείτε να δείτε στην εικόνα η μεταβλητή «i» που είναι ο μετρητής μας στην προκειμένη περίπτωση αρχικοποιείται στην τιμή 1 πριν από την εκκίνηση του βρόγχου. Μέσα στον βρόγχο ο μετρητής μας αυξάνεται κατά μια μονάδα. Όταν ο βρόγχος εκτελεστεί όσες φορές του εισάγουμε, η συνθήκη παύει να ισχύει γιατί ο μετρητής είναι μεγαλύτερος από όσες επαναλήψεις του ζητήσαμε. Εφόσον η συνθήκη δεν ισχύει ο βρόγχος σπάει και ο κώδικας συνεχίζεται αμέσως μετά το κλείσιμο του while.

Συχνά θα παρατηρείτε ονόματα μετρητών σε διάφορα παραδείγματα στο διαδίκτυο όπως «count», «counter», όπως επίσης όμως χρησιμοποιούνται μεταβλητές με ονόματα όπως «i» , «j» και «k». Όσο πιο περιγραφικά ονόματα χρησιμοποιείτε στον κώδικα σας τόσο ευκολότερο θα είναι να τον επεξεργαστείτε. 

do while

Το «do-while» είναι ένα είδος βρόγχου το οποίο εκτελείται τουλάχιστον μία φορά πριν αρχίσει να επαναλαμβάνεται ελέγχοντας αν ισχύει η συνθήκη του. Αυτό που συμβαίνει είναι ότι ο έλεγχος της συνθήκης γίνεται στο τέλος και όχι στην αρχή κάθε επανάληψης, επομένως εκτελείται τουλάχιστον μία φορά. Παρόμοια με την while έτσι κι εδώ ο μετρητής δηλώνεται έξω από τον βρόγχο, και ο μετρητής αλλάζει (αυξάνεται ή μειώνεται) μέσα σε αυτόν. Ο τρόπος σύνταξης έχει ως εξής:

var μετρητής=τιμή;
do{
 ... εντολές για επανάληψη ...
 μετρητής++;
}while(συνθήκη);
  • Όπου «var μετρητής = τιμή» πηγαίνει το όνομα του μετρητή και η αρχική τιμή του.
  • Όπου «... εντολές για επανάληψη ...» πηγαίνουν οι εντολές πού θέλουμε να εκτελεστούν τουλάχιστον μία φορά και ύστερα κατ’ επανάληψη
  • Όπου «μετρητής++» αυξάνεται ο μετρητής κατά μια μονάδα, θα μπορούσε κάλλιστα να μειώνεται η γενικώς να γίνεται οποιαδήποτε πράξη αλλαγής του.
  • Όπου «συνθήκη» πηγαίνει η συνθήκη που θέλουμε να ελέγχουμε στο τέλος κάθε επανάληψης.

Αρχείο:dowhile.html

<!DOCTYPE HTML>
<html>
 <head>
  <meta charset="utf-8">
  <title>Δοκιμή της do-while</title>
  <script type='text/javascript'>
   function nums_ins(x){
    var i=1;
    do{
     console.log(i);
     i++;
    }while(i<=x);
   }
  </script>
 </head>
 <body>
  Εισάγετε έναν αριθμό:
  <input type='text' name='temp' id='temp' onchange='nums_ins(this.value);'>
 </body>
</html>

Αποτέλεσμα:

Στο παραπάνω παράδειγμα, παρόλο που εισάγαμε 0 για αριθμό βάση του οποίου θα ξεκινήσει η μέτρηση, τυπώθηκε ο αριθμός «1» που σημαίνει ότι εκτελέσθηκε ο βρόγχος τουλάχιστον μία φορά χωρίς να λάβει υπόψη την συνθήκη.