Wednesday, August 1, 2018

ΕΝΟΤΗΤΑ 8 – Conditions και Loops στην JavaScript (part 1)

Μέχρι τώρα τα απλά παραδείγματα που έχουμε γράψει δεν έχουν ούτε την ικανότητα να επαναλαμβάνουν κάποιο μέρος του κώδικα χωρίς εμείς να χρειαστεί να το γράψουμε πάλι, αλλά ούτε μπορούν και να πάρουν αποφάσεις με βάση τις εισερχόμενες τιμές. Αυτό πρόκειται να το αλλάξουμε τώρα καθώς θα δώσουμε την δυνατότητα στα προγράμματά μας να ελέγχουν τις εισερχόμενες τιμές (ή γενικότερα τις τιμές που παίρνουν οι μεταβλητές) και αντίστοιχα να παίρνουν κάποιες αποφάσεις. Πριν όμως προχωρήσουμε σε αυτή την νέα θεωρία, ας βεβαιωθούμε πως καταλαβαίνουμε την ευρύτερη έννοια του code block.

Ένα block κώδικα είναι εκείνο που μέσα σε άγκιστρα (curly brackets) περιέχει μια ή και περισσότερες γραμμές κώδικα. Για παράδειγμα, ένα πολύ απλό block κώδικα είναι το εξής:

{
var a = 1;
var b = 2;
}

Επίσης επιτρέπεται να έχουμε nested blocks δηλαδή blocks μέσα σε blocks.

{
var a = 1;
var b = 2;
{
var c = 3;
}

}

Ας δούμε λοιπόν πως μπορούμε να χρησιμοποιούμε το if, έτσι ώστε με βάση κάποια συνθήκη που θα ορίσουμε να παίρνει και τις αντίστοιχες αποφάσεις. Η σύνταξη του if statements όπως ονομάζεται αποτελείται από τρία μέρη:
  1. Το if με το οποίο ξεκινάει ο κώδικας
  2. Αμέσως μετά και μέσα σε παρενθέσεις είναι η συνθήκη που χρησιμοποιείται για την σύγκριση
  3. Και τέλος του block του κώδικα που θα εκτελεστεί εφόσον η συνθήκη είναι true (δηλαδή αληθεύει). Το block του κώδικα είναι μέσα σε curly brackets.

Η συνθήκη μέσα στην παρένθεση πάντα επιστρέφει Boolean τιμή και μπορεί να περιέχει τους πιο κάτω τελεστές:
  • Local Operators: !, &&, ή ||
  • Comparison Operators: ===, !=, > κτλ.
  • Οποιαδήποτε τιμή ή μεταβλητή που μπορεί να μετατραπεί σε Boolean
  • Οποιοδήποτε συνδυασμό των πιο πάνω

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



Το μεγάλο πλεονέκτημα όμως του if/else συνδυασμού δεν είναι μόνο ο έλεγχος της ροής του κώδικα, αλλά και το γεγονός ότι μπορούμε να ελέγξουμε πολλαπλές συνθήκες (με την χρήση πολλαπλών συνδυασμών if/else) και όταν μια από αυτές επαληθευτεί να τρέξει ο κώδικας που ανήκει μόνο σε αυτή την συνθήκη. Τους υπόλοιπους συνδυασμούς if/else, από την στιγμή που επαληθεύτηκε ένας, τους παραλείπει η JavaScript και συνεχίζει με το υπόλοιπο πρόγραμμα. Πριν δούμε ένα παράδειγμα με πολλαπλά if/else ας αναφέρουμε το γεγονός ότι συνήθως κλείνουμε τους συνδυασμούς των if/else με ένα else το οποίο θα ενεργοποιηθεί αν κανένας από τους προηγούμενους συνδυασμούς δεν ήταν true. Με αυτό τον τρόπο για ακόμη μια φορά έχουμε τον απόλυτο έλεγχο του αποτελέσματος.




Πριν συνεχίσουμε, θα ήθελα να επισημάνω το γεγονός ότι όταν χρησιμοποιούμε το σύμβολο της ισότητας για να συγκρίνουμε αν δύο τιμές είναι ίσες ή όχι σε μια συνθήκη, αυτό το σύμβολο στην JavaScript είναι το τριπλό σύμβολο ισότητας ( === ). 




Μπορούμε επίσης να έχουμε nest conditions όπως στο παρακάτω παράδειγμα




Αν θέλουμε να δούμε ένα πιο πρακτικό παράδειγμα εφαρμόζοντας την θεωρία που έχουμε μάθει μέχρι τώρα, θα μπορούσε να είναι το εξής: θέλουμε κατά την διάρκεια εκτέλεσης της εφαρμογής μας να χρησιμοποιήσουμε μια μεταβλητή αφότου της έχει ανατεθεί κάποια τιμή πρώτα. Ειδάλλως, όπως ήδη έχουμε δει στις αρχικές ενότητες, μια μεταβλητή χωρίς τιμή θα επιστρέψει “undefined”. Το typeof πάντα επιστρέφει string και μπορούμε να συγκρίνουμε αυτό το string με την λέξη “undefined”.



Πριν κλείσουμε το πρώτο μέρος αυτής της ενότητας, ας δούμε και ένα εναλλακτικό τρόπο γραφής ενός απλού if/else.




Το πρώτο σκέλος είναι η παρένθεση η οποία περιέχει την συνθήκη που συγκρίνουμε ( a === 1). Αμέσως μετά από το ερωτηματικό ( ? ), το οποίο είναι μέρος του συντακτικού, ακολουθεί το μήνυμα που θα ακολουθήσει εάν η συνθήκη είναι true. Ο τελευταίος όρος ( που χαρακτηρίζεται από το : σύμβολο) είναι το μήνυμα που θα εμφανιστεί εάν η συνθήκη είναι false.

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