ΕΝΟΤΗΤΑ 6 – Booleans και Logical Operators στην JavaScript

Υπάρχουν μόνο δύο τιμές που μπορεί να έχει μια Boolean μεταβλητή – true ή false και χρησιμοποιούνται χωρίς double quotes.



Εάν κάνετε λάθος και βάλετε double quotes τότε δεν έχετε boolean τιμή αλλά ένα string.


Υπάρχουν τρεις τελεστές, που ονομάζονται logical operators, που χρησιμοποιούνται σε συνδυασμό με Boolean τιμές (https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Logical_Operators)


Η απλή λογική λέει ότι κάτι που δεν είναι true, τότε πρέπει να είναι false. Αν θέλαμε λοιπόν να αντιστρέψουμε την boolean τιμή μιας μεταβλητής τότε θα πρέπει να χρησιμοποιήσουμε τον ! logical operator. Αν τώρα χρησιμοποιήσουμε τον ίδιο logical operator δύο φορές τότε παίρνουμε σαν απάντηση την αρχική τιμή με την οποία ξεκινήσαμε.


 
Εάν χρησιμοποιήσουμε έναν logical operator σε μια μη Boolean τιμή, τότε η τιμή μετατρέπεται σε Boolean από την JavaScript για να μπορέσει να ολοκληρώσει την πράξη. Στο πιο κάτω παράδειγμα, η string τιμή “michail” μετατρέπεται αυτόματα σε true και μετά αντιστρέφεται σε false. Αν θέλουμε να πάρουμε true από οποιαδήποτε τιμή απλά χρησιμοποιούμε διπλή άρνηση.




Όπως μόλις είδαμε, μπορούμε να μετατρέψουμε οποιαδήποτε τιμή σε Boolean αν χρησιμοποιήσουμε διπλή άρνηση. Υπάρχουν όμως έξι συνθήκες που επιστρέφουν false αντί για true και για αυτό πρέπει να είμαστε ενημερωμένοι:
  • The empty string “ ”
  • null
  • undefined
  • The number 0
  • The number NaN
  • The Boolean false

Ας δούμε όμως μερικά παραδείγματα πως μπορούμε να χρησιμοποιήσουμε τους άλλους δύο logical operators που είναι το AND (&&) και το OR (||). Σαν γενικό κανόνα το AND θα επιστρέψει true όταν όλοι οι όροι του είναι true ενώ το OR θα επιστρέψει true όταν έστω ένας όρος του είναι true.



Μπορείτε να βρείτε όλους τους συνδυασμούς για το AND και OR στην εξής ιστοσελίδα του Mozilla (https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Expressions_and_Operators).


 
Μπορούμε, και να θα το δούμε πολύ συχνά αυτό σε κώδικα, να συνδυάσουμε περισσότερο από έναν logical operators.



Γιατί όμως το πιο πάνω παράδειγμα επιστρέφει true? Η απάντηση βρίσκεται στον πιο κάτω πίνακα (https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Operator_Precedence) ο οποίος μας διευκρινίζει το γεγονός ότι υπάρχει μια σειρά προτεραιότητας στην εκτέλεση των logical operators.



Με βάση τον πιο πάνω πίνακα, το AND προηγείται σε εκτέλεση από το OR οπότε θα εκτελεστεί πρώτο. Αν τώρα υπάρχουν περισσότερα από ένα && τότε η εκτέλεση αρχίζει από τα αριστερά προς τα δεξιά. Οπότε στην αρχή εκτελείται το b1 && a1 και το αποτέλεσμα αυτής της σύγκρισης θα εκτελεστεί με το a2. Επειδή το b1 είναι false, η εκτέλεση των && επιστρέφει false. Τώρα απομένει το a1 || (αποτέλεσμα από τα &&). Αν και το αποτέλεσμα των && είναι false το OR επιστρέφει true γιατί τουλάχιστον ένας όρος του (το a1 ) είναι true. Σας ακούγεται λίγο δύσκολο να το ακολουθήσετε? Τότε υπάρχει πιο εύκολος τρόπος: να χρησιμοποιήσετε παρενθέσεις στις πράξεις που θέλετε εσείς να εκτελεστούν πρώτες. Οι παρενθέσεις έχουν υψηλότερη προτεραιότητα εκτέλεσης από το AND και OR όποτε μπορούμε να ορίσουμε ακριβώς την σειρά των πράξεων. Νομίζω με βάση τα όσα έχουμε πει, το πιο κάτω παράδειγμα είναι πιο ξεκάθαρο τώρα:





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

Κάποια στιγμή μπορείτε να ακούσετε για την short-circuit συμπεριφορά της JavaScript όσο αφορά τους logical operators. Τι σημαίνει αυτό? Είναι πάρα πολύ απλό – όταν έχετε πολλαπλούς logical operators στην ίδια πράξη και είναι εμφανές το αποτέλεσμα από την αρχική σύγκριση, τότε η JavaScript δεν θα εκτελέσει ολόκληρη την πράξη έτσι ώστε να γλυτώσει περισσότερο execution time. Δηλαδή? Ας πάρουμε το παράδειγμα
true || false || true || false || true
Αφού ο πρώτος όρος είναι true, τότε οποιοδήποτε συνδυασμό ORs και αν προσπαθήσουμε θα πάρουμε true. Η JavaScript συγκρίνει τον πρώτο συνδυασμό από τα αριστερά προς τα δεξιά ( true || false) και αφού καταλαβαίνει ότι και οι υπόλοιπες συγκρίσεις είναι OR τότε τις παραβλέπει.

Πριν κλείσουμε θέλω να αναφερθούμε σε ένα ακόμα γκρουπ από operators που ονομάζονται comparison operators. Το αποτέλεσμα τους είναι μια Boolean τιμή αφότου συγκρίνουν τις τιμές (https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Expressions_and_Operators)




Αν και αυτοί οι operators θα έχουν μεγάλη αξία για μας λίγο αργότερα (όταν μάθουμε τις if/else συγκρίσεις) απλά για τώρα θα ήθελα να επισημάνω μια μεγάλη διαφορά μεταξύ του == και του === operator. Στο == operator, πρώτα οι δύο όροι μετατρέπονται αυτόματα από την JavaScript στο ίδιο data type και μετά συγκρίνονται, ενώ το === συγκρίνει αν και οι δύο όροι έχουν ίδιες τιμές και ίδιο data type χωρίς να γίνεται καμία μετατροπή. Αυτή είναι μια μικρή λεπτομέρεια που πρέπει να προσέξετε όταν διαβάζετε πίνακες όπως ο πιο πάνω.

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

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


Archive

Contact Form

Send