Οι μεταβλητές στη JavaScript είναι απαραίτητες για την αποθήκευση και την επεξεργασία δεδομένων. Είναι σημαντικό να κατανοήσετε πού ισχύουν αυτές οι μεταβλητές και σε ποιες περιοχές του κώδικά σας μπορούν να έχουν πρόσβαση. Δεδομένων των διαφορετικών τύπων μεταβλητών - παγκόσμιες και τοπικές - η κατανόηση της "εμβέλειας" (περιοχή ορατότητας) είναι θεμελιώδης. Ας βουτήξουμε λοιπόν και ας μάθουμε τι σημαίνουν οι παγκόσμιες και οι τοπικές μεταβλητές.
Βασικές διαπιστώσεις
- Οι παγκόσμιες μεταβλητές είναι προσβάσιμες παντού στον κώδικα, ενώ οι τοπικές μεταβλητές είναι ορατές μόνο εντός της συνάρτησης τους.
- Ο ορισμός μιας μεταβλητής εκτός συνάρτησης την καθιστά παγκόσμια, ενώ ο ορισμός της εντός συνάρτησης την καθιστά τοπική.
- Για μια σαφή και συντηρήσιμη δομή του κώδικα, είναι πλεονέκτημα να δηλώνονται οι παγκόσμιες μεταβλητές στην αρχή του σεναρίου.
Οδηγίες βήμα προς βήμα
Ορισμός των μεταβλητών και της ορατότητάς τους
Στο πρώτο βήμα, θα δούμε πώς μπορείτε να δημιουργήσετε μια μεταβλητή και τι σημαίνει η ορατότητά της. Εάν δηλώσετε μια μεταβλητή εκτός οποιασδήποτε συνάρτησης, όπως φαίνεται στο ακόλουθο παράδειγμα, είναι παγκόσμια.

Εδώ δημιουργούμε μια παγκόσμια μεταβλητή που ονομάζεται myVariable.
Δημιουργία συναρτήσεων με τοπικές μεταβλητές
Στη συνέχεια, δημιουργούμε δύο συναρτήσεις. Ονομάζουμε τη μία συνάρτηση localFunction, στην οποία δημιουργούμε μια τοπική μεταβλητή. Αυτή η μεταβλητή είναι ορατή μόνο μέσα στη συνάρτηση. Ας ορίσουμε τη συνάρτησή μας.
Στη συνάρτηση localFunction, δημιουργούμε μια τοπική μεταβλητή localV με την τιμή 5 και την εξάγουμε.
Κλήση των συναρτήσεων
Τώρα θέλουμε να καλέσουμε τη συνάρτηση localFunction για να εξάγουμε τον αριθμό 5. Αφού έχουμε καλέσει τη συνάρτηση στον κώδικα, η έξοδος φαίνεται ως εξής:
Έλεγχος της ορατότητας της τοπικής μεταβλητής
Τώρα προσπαθούμε να χρησιμοποιήσουμε την τοπική μεταβλητή localV σε μια άλλη συνάρτηση. Θα παρατηρήσετε ότι αυτό δεν λειτουργεί. Ας κάνουμε μια κλήση στην otherFunction και ας δούμε τι θα συμβεί.
Λαμβάνουμε ένα σφάλμα επειδή η μεταβλητή localV είναι ορατή μόνο μέσα στη συνάρτηση localFunction.
Έλεγχος σφαλμάτων στην κονσόλα
Για να κατανοήσουμε καλύτερα γιατί εμφανίζεται το σφάλμα, ας εξετάσουμε τον κώδικα στην κονσόλα. Κάνοντας δεξί κλικ και επιλέγοντας "Εξέταση", μπορείτε να ανοίξετε τον εξερευνητή DOM και την κονσόλα για να αναλύσετε το σφάλμα.

Εκεί θα δείτε ότι το localV είναι απροσδιόριστο. Αυτό επιβεβαιώνει την υπόθεση ότι η μεταβλητή δεν υπάρχει έξω από τη λειτουργία της.
Ορισμός μιας παγκόσμιας μεταβλητής
Ας δημιουργήσουμε τώρα μια παγκόσμια μεταβλητή που μπορούμε να χρησιμοποιήσουμε και στις δύο συναρτήσεις. Ονομάζουμε αυτή τη μεταβλητή globalVariable και της δίνουμε μια απλή τιμή κειμένου.

Τώρα αυτή η παγκόσμια μεταβλητή μπορεί να κληθεί και στις δύο συναρτήσεις και η έξοδος θα είναι η ίδια. Ας το δοκιμάσουμε μια φορά.

Ορισμός μεταβλητής και σειρά κλήσης
Είναι σημαντικό να σημειωθεί ότι η σειρά των ορισμών των μεταβλητών και των συναρτήσεων είναι κρίσιμη. Αν δημιουργήσετε μια παγκόσμια μεταβλητή κάτω από τη χρήση της, αυτό θα οδηγήσει σε ένα πρόβλημα που δεν έχει οριστεί.
Αυτό συμβαίνει επειδή η συνάρτηση που χρειάζεται την παγκόσμια μεταβλητή θα την καλέσει πριν από τον ορισμό της. Για να αποφευχθεί αυτό, είναι σκόπιμο να ορίζονται οι παγκόσμιες μεταβλητές στην αρχή του κώδικα.
Περισσότερα για τις τοπικές μεταβλητές και τη χρήση τους
Τώρα δημιουργούμε μια άλλη τοπική μεταβλητή σε μια άλλη συνάρτηση. Εδώ την ονομάζουμε localVariable και ορίζουμε την τιμή της σε 12.
Μπορούμε επίσης να χρησιμοποιήσουμε αυτή την τοπική μεταβλητή, αλλά μόνο μέσα στη δική της συνάρτηση και όχι σε άλλες. Αν χρησιμοποιείτε και τις δύο τοπικές μεταβλητές, αυτό μπορεί να εξασφαλίσει υπομονή και τάξη στα προγράμματά σας, ανάλογα με την πολυπλοκότητά τους.
Συνοψίζοντας τις έννοιες
Τώρα κατανοείτε τις βασικές έννοιες σχετικά με την ορατότητα και την εμβέλεια των μεταβλητών στη JavaScript. Οι παγκόσμιες μεταβλητές είναι ορατές σε όλες τις συναρτήσεις, ενώ οι τοπικές μεταβλητές υπάρχουν μόνο μέσα στη συνάρτησή τους. Είναι σκόπιμο να ορίζετε τις παγκόσμιες μεταβλητές σε μια κεντρική θέση στον κώδικα για να βελτιώσετε την αναγνωσιμότητα και τη συντηρησιμότητα.
Περίληψη - Η ορατότητα των μεταβλητών στη JavaScript
Συνοψίζοντας, μάθατε ότι ο τρόπος με τον οποίο ορίζετε τις μεταβλητές έχει άμεση επίδραση στην ορατότητα και την εμβέλειά τους. Να δίνετε πάντα προσοχή στο πού τοποθετείτε τις μεταβλητές σας για να αποφύγετε τα λάθη.
Συχνές ερωτήσεις
Τι είναι οι παγκόσμιες μεταβλητές;Οι παγκόσμιες μεταβλητές είναι μεταβλητές που δηλώνονται εκτός συναρτήσεων και επομένως είναι προσβάσιμες σε όλο το σενάριο.
Τι είναι οι τοπικές μεταβλητές;Οι τοπικές μεταβλητές είναι μεταβλητές που δημιουργούνται εντός μιας συνάρτησης και είναι ορατές μόνο εντός αυτής της συνάρτησης.
Πώς μπορώ να χρησιμοποιήσω καλύτερα τις παγκόσμιες μεταβλητές; Συνιστάται να ορίζετε τις παγκόσμιες μεταβλητές στην αρχή του σεναρίου για να εξασφαλίσετε μια σαφή δομή και καλύτερη συντηρησιμότητα.
Μπορώ να χρησιμοποιήσω τοπικές μεταβλητές εκτός της συνάρτησης τους;Όχι, οι τοπικές μεταβλητές είναι ορατές μόνο εντός της συνάρτησης στην οποία ορίστηκαν.
Πώς αντιμετωπίζω τα σφάλματα που δεν έχουν οριστεί;δώστε προσοχή στη σειρά με την οποία ορίζετε τις μεταβλητές και τις συναρτήσεις για να διασφαλίσετε ότι οι απαιτούμενες μεταβλητές ορίζονται πριν από τη χρήση τους.