Εισηγητής

ΜΙΧΑΛΗΣ ΚΑΣΑΠΟΓΛΟΥ

Κατηγορία

PROGRAMMING

Στο σημερινό δωρεάν μάθημα JavaScript, θα συνεχίσουμε την αναφορά μας στα conditions αναλύοντας το switch statement, ενώ θα προχωρήσουμε την θεωρία μας και στα τέσσερα διαφορετικά είδη loop που υπάρχουν στην JavaScript

Στην προηγούμενη ενότητα μιλήσαμε για το if/else και πως μπορούμε να το εφαρμόσουμε στον κώδικα μας όταν έχουμε ανάγκη να ελέγξουμε περισσότερες από μια συνθήκη. Εάν όμως καταλήξουμε να χρησιμοποιήσουμε πάρα πολλά if/else ίσως το switch να είναι μια καλύτερη λύση.

Ας δούμε ένα ολοκληρωμένο παράδειγμα και θα εξηγήσουμε αμέσως μετά πως συντάσσεται.

Ορίζουμε λοιπόν εξ αρχής μια μεταβλητή a και της αναθέτουμε το String 1 (όχι τον αριθμό 1) και μετά ορίζουμε μια δεύτερη μεταβλητή με το όνομα result η οποία θα λάβει την τελική της τιμή από το αποτέλεσμα της σύγκρισης που θα κάνει το switch.

To switch ορίζεται με την λέξη κλειδί switch και αμέσως μετά ακολουθεί η μεταβλητή για την οποία θα κάνουμε διάφορους ελέγχους ανάλογα με τους κανόνες που έχουμε ορίσει μέσα στο switch. Μέσα στην παρένθεση που ακολουθεί το switch βάζουμε την μεταβλητή που θέλουμε να ελέγξουμε. Προσέξτε δεν βάζουμε συνθήκη εδώ αλλά μια μεταβλητή που ξέρουμε ακριβώς ποια είναι η τιμή της.

Μέσα σε άγκιστρα ( { } ) ξεκινάμε μια σειρά από ελέγχους που ορίζονται από την λέξη case. Κάθε case ακολουθείται και από μια τιμή την οποία συγκρίνουμε με αυτή που έχει η μεταβλητή που βάλαμε μέσα στην παρένθεση του Switch στην αρχή. Εάν η μεταβλητή περιέχει την τιμή για την οποία κάνουμε τον έλεγχο, τότε αμέσως μετά από το colon ( : ) οτιδήποτε κώδικα έχουμε γράψει θα εκτελεστεί. Νομίζω ότι είναι πολύ φανερό πως κάνουμε ελέγχους με το case. Γράφουμε είτε αριθμούς είτε string που ίσως περιέχει η μεταβλητή και colon ( : ).

Θα παρατηρήσετε ότι μέσα σε κάθε case, η ολοκλήρωση εκτέλεσης του κώδικα γίνεται με την λέξη κλειδί break. Αν και η χρήση του break είναι προαιρετική, δίνει όμως την απαραίτητη λειτουργικότητα που ζητάμε στον κώδικα μας - όταν εκτελεστεί ο κώδικας του εκάστοτε case, το break θα βοηθήσει το πρόγραμμα μας να σταματήσει να “ασχολείται” με το switch και να συνεχίσει με το υπόλοιπο πρόγραμμα της εφαρμογής. Με άλλα λόγια όταν μια από τις συνθήκες του switch βγει true, τότε θα εκτελεστεί ο κώδικας του εκάστοτε case, και με το break το πρόγραμμα θα μεταπηδήσει έξω από το switch για να συνεχίσει την εκτέλεση του υπόλοιπου προγράμματος.

Όπως και στο if else έτσι και στο switch, για να μπορέσουμε να καλύψουμε οποιαδήποτε άλλη συνθήκη για την οποία δεν έχουμε κάνει έλεγχο μπορούμε να χρησιμοποιήσουμε την λέξη κλειδί default. Με αυτό τον τρόπο είμαστε σίγουροι ότι το πρόγραμμα μας σίγουρα θα περάσει από το switch είτε γιατί βγήκε true κάποια από τις συνθήκες για τις οποίες κάναμε έλεγχο είτε γιατί ενεργοποιήθηκε το default για οποιαδήποτε άλλη συνθήκη για την οποία δεν ελέγξαμε.

Προσέξτε λίγο με το break. Αν ξεχάσετε να το βάλετε τότε ο κώδικας θα εκτελέσει το case για το οποίο βγήκε true η συνθήκη αλλά θα συνεχίσει και θα εκτελέσει και τον κώδικα του επόμενου case. Αν και αυτό δεν έχει break τότε θα συνεχίσει να εκτελεί και τον κώδικα και του επόμενου case μέχρι να φτάσει στο default. Πολλές φορές η παράλειψη ενός break είναι εσκεμμένη εάν θέλουμε να εκτελεστεί ο ίδιος κώδικας για περισσότερα από ένα case. Ας δούμε λίγο αυτή την λογική με ένα απλό παράδειγμα.

Όπως και στην προηγούμενη ενότητα, έτσι και στο σημερινό δωρεάν μάθημα JavaScript, θα δείξουμε ένα παράδειγμα πως μπορούμε να χρησιμοποιήσουμε το switch σε μια πραγματική html σελίδα. Συγκεντρωθείτε απλά στον κώδικα του switch. Τις υπόλοιπες εντολές θα τις αναλύσουμε αργότερα, οπότε μην ανησυχείτε που δεν τις καταλαβαίνετε ακόμα.

Μέχρι τώρα αναλύσαμε τα if/else και switch statements τα οποία επιτρέπουν στον κώδικα μας να παίρνει αποφάσεις με βάση κάποια συνθήκη που έχει οριστεί. Αν τώρα θέλουμε ένα μπλοκ κώδικα να επαναλαμβάνεται συνέχεια μέχρι το αποτέλεσμα κάποιας συνθήκης να είναι true ή false τότε πρέπει να χρησιμοποιήσουμε loops.

Στην JavaScript έχουμε τέσσερα διαφορετικά είδη loops:

• while loops
• do-while loops
• for loops
• for-in loops

Ας τα δούμε λοιπόν ένα προς ένα τα loop μέσα από παραδείγματα.

WHILE LOOP

Ένα while loop ορίζεται από την λέξη κλειδί while και μια συνθήκη. Μέσα στα άγκιστρα γράφουμε τον κώδικα που θα τρέχει σε κάθε επανάληψη. Η ανάλυση για το πιο πάνω πρόγραμμα είναι η εξής: Ορίζουμε ένα while loop από το οποίο ζητάμε όσο η συνθήκη παραμένει true, να αυξάνεται η τιμή του x προσθέτοντας την τιμή του n στο x σε κάθε επανάληψη. Οι τιμές του x και του n μέσα στον κώδικα αλλάζουν ως εξής:

- Μετά την πρώτη επανάληψη n = 1 και x = 1

- Μετά την δεύτερη επανάληψη n = 2 και x = 3

- Μετά την τρίτη επανάληψη n = 3 και x = 6

Αμέσως μετά την ολοκλήρωση της τρίτης επανάληψης, η συνθήκη n < 3 είναι false οπότε και το loop σταματάει να εκτελείται. Η πιο σημαντική γραμμή μέσα στο while loop είναι το n++. Αν δεν επηρεάσουμε κατά κάποιο τρόπο την τιμή της μεταβλητής n μέσα στον κώδικα μας, τότε η τιμή του n δεν πρόκειται να μεταβάλλεται και η συνθήκη θα είναι πάντα true προκαλώντας ένα infinite loop (δεν θα σταματάει ποτέ). Ένα while loop χρησιμοποιείται συνήθως όταν ο αριθμός των επαναλήψεων δεν είναι γνωστός.

DO-WHILE LOOP

Το Do-While loop λειτουργεί με τον ίδιο τρόπο όπως και το while loop με την διαφορά ότι η συνθήκη θα ελεγχθεί στο τέλος αφότου έχει εκτελεστεί ο κώδικας και όχι στην αρχή. Συνήθως χρησιμοποιούμε το Do-While loop όταν θέλουμε να βεβαιωθούμε ότι ο κώδικας μέσα στο loop θα εκτελεστεί τουλάχιστον μια φορά.

FOR LOOP

Χρησιμοποιούμε το for loop (με την λέξη κλειδί for) συνήθως όταν ο αριθμός των επαναλήψεων είναι γνωστός ή προβλέψιμος. Το for loop αποτελείται από τρία expressions τα οποία χωρίζονται με semicolons (;) το ένα από το άλλο. Και οι τρεις όροι είναι μέσα σε μια παρένθεση.

Το πρώτο expression ονομάζεται initialization και είναι εκεί που ορίζουμε και αρχικοποιούμε τις μεταβλητές που συνήθως παίζουν το ρόλο του counter.

Ο δεύτερος όρος είναι το condition και εκεί ορίζεται η συνθήκη στην οποία θα στηριχτεί η εκτέλεση του loop. Όσο η συνθήκη είναι true τότε το loop θα συνεχίζει να εκτελείται.

Το τελευταίο expression ονομάζεται step ή final expression και είναι εκεί που ορίζουμε αν θέλουμε το counter να αυξάνεται ή να μειώνεται και κατά πόσο (π.χ. i + 2).

FOR...IN LOOP

Το for...in loop χρησιμοποιείται για να διαβάσει διαδοχικά όλα τα στοιχεία που ανήκουν σε ένα αντικείμενο (object) ή έναν πίνακα (array). Επειδή ακόμα δεν έχουμε μιλήσει για αντικείμενα, το παράδειγμα που δείχνουμε εδώ διαβάζει τα στοιχεία από έναν array. Γενικότερα, το for..in loop δεν μπορεί να χρησιμοποιηθεί σαν ένα γενικού τύπου loop σε αντικατάσταση του for ή του while. Η πιο σύνηθες χρήση του είναι με αντικείμενα.

Στο πιο παραπάνω παράδειγμα, διαβάζουμε όλα τα στοιχεία ενός array και δείχνουμε για κάθε index την τιμή που έχουμε διαβάσει από τον array.

ΕΙΣΗΓΗΤΗΣ

Μιχάλης Κασάπογλου

Ο Μιχάλης Κασάπογλου, είναι ένας από τους πιο έμπειρους τεχνικούς εκπαιδευτές στον χώρο του προγραμματισμού με πάνω από 20 χρόνια εμπειρία. Έχει εργαστεί σαν IT Operations Manager, Senior Programmer, και Training Team Leader ενώ κατέχει και αρκετές πιστοποιήσεις που καλύπτουν ένα μεγάλο φάσμα τεχνολογιών στο προγραμματισμό, σε βάσεις δεδομένων και cloud. Στον ελεύθερο του χρόνο διατηρεί ένα τεχνολογικό blog στο οποίο θα βρείτε αρκετά δωρεάν μαθήματα προγραμματισμού για αρχάριους.