Προγραμματισμός

«Εξατομικευμένη JavaScript»: Λειτουργίες, αντικείμενα και μέθοδοι που καθορίζονται από τον χρήστη

Ως σύγχρονη γλώσσα προγραμματισμού, το JavaScript υποστηρίζει την πλήρη επεκτασιμότητα, επιτρέποντάς σας να ορίσετε τις δικές σας λειτουργίες. Αυτό σας επιτρέπει να δημιουργήσετε ρουτίνες που μπορείτε να χρησιμοποιήσετε ξανά και ξανά. Εξοικονομείτε χρόνο στην επαναχρησιμοποίηση κοινών "στοιχείων" και σχεδιάζοντας τις δικές σας λειτουργίες μπορείτε να επεκτείνετε τη βασική γλώσσα της JavaScript για να ταιριάζει στις ανάγκες σας. Σκεφτείτε το ως "εξατομικευμένη JavaScript".

Δεδομένου ότι η JavaScript βασίζεται σε αντικείμενα, μια συνάρτηση JavaScript μπορεί εύκολα να μετατραπεί σε αντικείμενο και μια μέθοδο για αυτό το αντικείμενο. Έτσι, όχι μόνο μπορείτε να δημιουργήσετε αντικείμενα που καθορίζονται από τον χρήστη για να κάνετε την υποβολή προσφορών σας, αλλά και να δημιουργήσετε τα δικά σας αντικείμενα που συμπεριφέρονται με τον ίδιο τρόπο που θέλετε. Και μπορείτε να δημιουργήσετε μεθόδους που δρουν σε αυτά τα αντικείμενα. Ενώ αυτό ακούγεται ισχυρό - και είναι - η διαδικασία δημιουργίας λειτουργιών, αντικειμένων και μεθόδων είναι πολύ εύκολη στο JavaScript.

Εισαγωγή λειτουργιών

Χρησιμοποιήστε τη δήλωση συνάρτησης για να δημιουργήσετε τη δική σας λειτουργία JavaScript. Η σύνταξη γυμνών οστών είναι:

λειτουργία όνομα (παραμάς) { ... πράγματα λειτουργίας ... } 
  • όνομα είναι το μοναδικό όνομα της συνάρτησης. Όλα τα ονόματα συναρτήσεων σε ένα σενάριο πρέπει να είναι μοναδικά.
  • παραμάς είναι μία ή περισσότερες μεταβλητές παραμέτρων που μεταβιβάζετε στη συνάρτηση.
  • λειτουργικά πράγματα είναι οι οδηγίες που εκτελούνται από τη συνάρτηση. Μπορείτε να βάλετε τα περισσότερα εδώ.

Παρατηρήστε τους χαρακτήρες {και} αγκύλης. αυτά ορίζουν το μπλοκ λειτουργίας, και είναι απολύτως απαραίτητα. Τα τιράντες λένε JavaScript όπου ξεκινά και τελειώνει μια λειτουργία. Απαιτούνται επίσης οι παρενθέσεις γύρω από τις παραμέτρους. Συμπεριλάβετε τις παρενθέσεις ακόμη και αν η συνάρτηση δεν χρησιμοποιεί παραμέτρους (και πολλές δεν χρησιμοποιούν).

Τα ονόματα για τις λειτουργίες που ορίζονται από τον χρήστη εξαρτώνται από εσάς, αρκεί να χρησιμοποιείτε μόνο αλφαριθμητικούς χαρακτήρες (ο χαρακτήρας υπογράμμισης _ επιτρέπεται επίσης). Τα ονόματα των συναρτήσεων πρέπει να ξεκινούν με ένα γράμμα, αλλά μπορούν να περιλαμβάνουν αριθμούς αλλού στο όνομα.

Έχω κολλήσει με το στυλ JavaScript της κεφαλαιοποίησης ονόματος λειτουργίας - δηλαδή, αρχικά πεζά και έπειτα κεφαλαίους χαρακτήρες εάν το όνομα της συνάρτησης αποτελείται από σύνθετες λέξεις. Για παράδειγμα, myFuncName, το όνομα σας, ή το όνομα τους. Τα ονόματα των λειτουργιών είναι πεζά-κεφαλαία. φροντίστε να χρησιμοποιήσετε την ίδια κεφαλαία όταν αναφέρεστε στη συνάρτηση αλλού στο σενάριο. Το JavaScript θεωρεί myFunc διαφορετικός από Myfunc.

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

Καθορισμός και χρήση μιας συνάρτησης

Ο καλύτερος τρόπος για να περιγράψετε πώς και γιατί μια συνάρτηση είναι να δείξετε ένα απλό σε δράση. Ακολουθεί μια βασική λειτουργία που εμφανίζει "Γεια σας, JavaScripters!" και είναι μια προφανής απογείωση στο "Hello World!" παράδειγμα που βλέπετε για νέες γλώσσες προγραμματισμού.

function basicFunction () {alert ("Γεια σας JavaScripters!"); } 

Αυτό απλά ορίζει η λειτουργία. Το JavaScript δεν θα κάνει τίποτα με αυτό, εκτός εάν η συνάρτηση αναφέρεται σε κάποιο άλλο μέρος του σεναρίου. Πρέπει να κλήση τη λειτουργία για να τη χρησιμοποιήσετε. Η κλήση μιας λειτουργίας που καθορίζεται από τον χρήστη είναι ίδια με την κλήση μιας ενσωματωμένης συνάρτησης JavaScript - απλώς παρέχετε το όνομα της συνάρτησης στο σενάριό σας. Αυτό χρησιμεύει ως κλήση λειτουργίας. Όταν το JavaScript συναντά την κλήση συνάρτησης, διαγράφεται για να ολοκληρώσει οποιεσδήποτε οδηγίες υπάρχουν σε αυτήν τη λειτουργία. Όταν ολοκληρωθεί η συνάρτηση, η JavaScript επιστρέφει στο σημείο αμέσως μετά την κλήση της συνάρτησης και επεξεργάζεται το υπόλοιπο του σεναρίου.

Για να καλέσετε τη συνάρτηση παραπάνω, απλώς συμπεριλάβετε το κείμενο basicFunction () - σημειώστε τις κενές παρενθέσεις, όπως απαιτούνται. Ακολουθεί ένα λειτουργικό παράδειγμα του προγράμματος Hello JavaScripters.

Βασική συνάρτηση Παράδειγμα συνάρτησης basicFunction () {alert ("Γεια σας JavaScripters!"); }

basicFunction ();

Η σελίδα έχει φορτωθεί.

Το πρόγραμμα περιήγησης επεξεργάζεται τα περιεχόμενα της ετικέτας καθώς φορτώνεται το έγγραφο. Όταν συναντά το βασική λειτουργία () κλήση λειτουργίας, διακόπτεται στιγμιαία για την επεξεργασία της λειτουργίας και εμφανίζεται ένα πλαίσιο προειδοποίησης. Κάντε κλικ στο OK και το υπόλοιπο της σελίδας ολοκληρώνεται η φόρτωση.

Κλήση μιας λειτουργίας με χειριστή συμβάντων

Ένας κοινός τρόπος κλήσης μιας συνάρτησης είναι να συμπεριλάβετε μια αναφορά σε αυτό σε ένα κουμπί φόρμας ή σε έναν σύνδεσμο υπερκειμένου. Η επεξεργασία μιας λειτουργίας που καθορίζεται από τον χρήστη όταν ο χρήστης κάνει κλικ σε ένα κουμπί φόρμας είναι ίσως η ευκολότερη από όλες. Χρησιμοποιείτε το πρόγραμμα χειρισμού συμβάντων onClick για να πείτε στο JavaScript ότι όταν ο χρήστης κάνει κλικ στο κουμπί, η καθορισμένη συνάρτηση πρέπει να υποβληθεί σε επεξεργασία. Ακολουθεί μια αναθεωρημένη έκδοση του προηγούμενου παραδείγματος, που δείχνει τον τρόπο με τον οποίο καλείται basicFunction όταν γίνεται κλικ στο κουμπί φόρμας.

Βασική συνάρτηση Παράδειγμα συνάρτησης basicFunction () {alert ("Γεια σας JavaScripters!"); }

Λειτουργία κλικ για κλήση.

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

Μεταβίβαση μιας τιμής σε μια συνάρτηση

Οι λειτουργίες JavaScript υποστηρίζουν τιμές που περνούν - ή Παράμετροι -- σε αυτούς. Αυτές οι τιμές μπορούν να χρησιμοποιηθούν για επεξεργασία εντός της συνάρτησης. Για παράδειγμα, αντί να έχετε το πλαίσιο προειδοποίησης πείτε "Γεια σας JavaScripters!" όποτε το καλείτε, μπορείτε να το πείτε οτιδήποτε θέλετε. Το κείμενο προς εμφάνιση μπορεί να περάσει ως παράμετρος στη συνάρτηση.

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

function basicExample (Text) {alert (Κείμενο); } 

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

basicExample ("Αυτό λέει οτιδήποτε θέλω"); 

Μεταβίβαση πολλαπλών τιμών σε μια συνάρτηση

Μπορείτε να μεταβιβάσετε πολλές παραμέτρους σε μια συνάρτηση. Όπως με τις ενσωματωμένες λειτουργίες και μεθόδους JavaScript, διαχωρίστε τις παραμέτρους με κόμματα:

multiParams ("ένα", "δύο"). ... λειτουργία πολλαπλών παραμέτρων (Param1, Param2) {... 

Όταν ορίζετε μια συνάρτηση με πολλές παραμέτρους, βεβαιωθείτε ότι οι παράμετροι παρατίθενται με την ίδια σειρά στην κλήση συνάρτησης. Διαφορετικά, ο κώδικας JavaScript ενδέχεται να εφαρμόζει τις παραμέτρους σε λάθος μεταβλητές και η λειτουργία σας δεν θα λειτουργεί σωστά.

Ακολουθεί ένα παράδειγμα λειτουργίας μιας συνάρτησης με πολλές παραμέτρους. Χρειάζονται δύο παράμετροι: μια συμβολοσειρά εισόδου και μια τιμή αριθμού. Η τιμή αριθμού δείχνει πόσους χαρακτήρες στα αριστερά της συμβολοσειράς θέλετε να εμφανίσετε στο πλαίσιο ειδοποίησης. Όταν εκτελείτε το ακόλουθο σενάριο, το πλαίσιο ειδοποίησης εμφανίζει "Αυτό είναι" - τους πρώτους επτά χαρακτήρες της συμβολοσειράς εισόδου.

Παγκόσμιο παράδειγμα μεταβλητής αριστερά ("Αυτό είναι ένα τεστ", 7).

συνάρτηση lefty (InString, Num) {var OutString = InString.substring (InString, Num); προειδοποίηση (OutString) }

Επιστροφή τιμής από μια συνάρτηση

Οι συναρτήσεις που περιγράφονται μέχρι στιγμής δεν επιστρέφουν τιμή. δηλαδή, κάνουν ό, τι μαγεία θέλετε να κάνουν και μετά τελειώνουν. Δεν παρέχεται τιμή "εξόδου" από τη συνάρτηση. Σε ορισμένες άλλες γλώσσες, τέτοιες συναρτήσεις χωρίς επιστροφή ονομάζονται υπορουτίνες. Ωστόσο, σε JavaScript (όπως στα C και C ++), οι "συναρτήσεις είναι συναρτήσεις" ανεξάρτητα από το αν επιστρέφουν μια τιμή ή όχι.

Είναι εύκολο να επιστρέψετε μια τιμή από μια συνάρτηση: χρησιμοποιήστε το ΕΠΙΣΤΡΟΦΗ δήλωση, μαζί με την τιμή που θέλετε να επιστρέψετε. Αυτό είναι βολικό όταν θέλετε η λειτουργία σας να ανακαλύψει ορισμένα δεδομένα και να επιστρέψει το επεξεργασμένο αποτέλεσμα. Πάρτε τη λειτουργία "αριστερά" από ψηλά. Αντί να εμφανιστεί η κομμένη συμβολοσειρά, μπορείτε να την επιστρέψετε στη λειτουργία κλήσης και να χρησιμοποιήσετε την τιμή επιστροφής με όποιον τρόπο θέλετε.

Παγκόσμιο παράδειγμα μεταβλητής var Ret = lefty ("Αυτό είναι ένα τεστ", 7); προειδοποίηση (Ret);

συνάρτηση lefty (InString, Num) {var OutString = InString.substring (InString, Num); επιστροφή (OutString); }

Αυτό το σενάριο κάνει ουσιαστικά το ίδιο με το προηγούμενο παράδειγμα, αλλά αντί να εμφανίζει πάντα το κομμένο κείμενο, η συνάρτηση επιστρέφει απλώς την επεξεργασμένη τιμή. Η τιμή επιστροφής καταγράφεται σε μια μεταβλητή και είστε ελεύθεροι να χρησιμοποιήσετε αυτήν τη μεταβλητή με όποιον τρόπο θέλετε. Τα παραπάνω δείχνουν το Μουσκεύω μεταβλητή που χρησιμοποιείται με ένα πλαίσιο ειδοποίησης, αλλά μπορείτε να το χρησιμοποιήσετε και με άλλους τρόπους. Για παράδειγμα, μπορείτε να γράψετε τα περιεχόμενα της μεταβλητής Ret χρησιμοποιώντας το document.write μέθοδος:

document.write (Ret); 

Καθορισμός τοπικών μεταβλητών σε συναρτήσεις

Από προεπιλογή, όλες οι μεταβλητές JavaScript δηλώνονται καθολικές για το έγγραφο που τις δημιούργησε. Αυτό σημαίνει ότι όταν ορίζετε μια μεταβλητή σε μια συνάρτηση, είναι επίσης "ορατή" σε οποιοδήποτε άλλο τμήμα του σεναρίου αυτού του εγγράφου. Για παράδειγμα, στην ακόλουθη καθολική δοκιμή μεταβλητής, η δοκιμή μεταβλητής είναι ορατή στο showVar συνάρτηση, παρόλο που η μεταβλητή ορίζεται στο φορτίο λειτουργία.

Παγκόσμιο παράδειγμα μεταβλητής

function showVar () {alert (δοκιμή)}

συνάρτηση loadVar () {test = "6"}

loadVar ();

Λειτουργία κλικ για κλήση.

Οι καθολικές μεταβλητές δεν είναι πάντα αυτό που θέλετε. Αντ 'αυτού, θέλετε μεταβλητές που είναι τοπικές στη συνάρτηση. Αυτές οι μεταβλητές υπάρχουν μόνο εφόσον η JavaScript επεξεργάζεται τη συνάρτηση. Όταν βγαίνει από τη συνάρτηση, οι μεταβλητές χάνονται. Επιπλέον, μια τοπική μεταβλητή ενός δεδομένου ονόματος αντιμετωπίζεται ως ξεχωριστή οντότητα από μια καθολική μεταβλητή του ίδιου ονόματος. Με αυτόν τον τρόπο, δεν χρειάζεται να ανησυχείτε για την επαναχρησιμοποίηση μεταβλητών ονομάτων. Η τοπική μεταβλητή στη συνάρτηση δεν θα επηρεάσει την καθολική μεταβλητή που χρησιμοποιείται αλλού στο σενάριο.

Για να δηλώσετε μια τοπική μεταβλητή, προσθέστε τη λέξη-κλειδί var στην αρχή του ονόματος της μεταβλητής στη συνάρτηση. Αυτό λέει στο JavaScript ότι θέλετε να κάνετε τη μεταβλητή τοπική σε αυτήν τη συνάρτηση. Ως δοκιμή, αλλάξτε το φορτίο Λειτουργία παραπάνω στα ακόλουθα και φορτώστε ξανά το σενάριο. Όταν κάνετε κλικ στο κουμπί, το JavaScript σας λέει ότι η μεταβλητή δεν υπάρχει. Αυτό συμβαίνει επειδή η δοκιμή είναι μόνο τοπική στο φορτίο συνάρτηση και δεν υπάρχει εκτός της συνάρτησης.

συνάρτηση loadVar () {var test = "6"} 

Κλήση μιας λειτουργίας από άλλη λειτουργία

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

λειτουργία run () {var Ret = changeText ("Change me"); προειδοποίηση (Ret); document.write (Ret); } function changeText (Text) {Text = makeBold (Κείμενο); Κείμενο = makeItalics (Κείμενο); Κείμενο = makeBig (Κείμενο); επιστροφή (Κείμενο); } συνάρτηση makeBold (InString) {return (InString.bold ()); } λειτουργία makeItalics (InString) {return (InString.italics ()); } συνάρτηση makeBig (InString) {return (InString.big ()); } 

Δημιουργία αντικειμένων με καθορισμένες από το χρήστη λειτουργίες

Το JavaScript βασίζεται σε αντικείμενα: το παράθυρο είναι ένα αντικείμενο, οι σύνδεσμοι είναι αντικείμενα, οι φόρμες είναι αντικείμενα, ακόμη και το ίδιο το Netscape (ή άλλο πρόγραμμα περιήγησης) είναι ένα αντικείμενο. Η χρήση αντικειμένων μπορεί να διευκολύνει και να βελτιώσει τον προγραμματισμό. Μπορείτε να επεκτείνετε τη χρήση αντικειμένων σε JavaScript δημιουργώντας τη δική σας. Η διαδικασία χρησιμοποιεί συναρτήσεις με ελαφρώς τροποποιημένο τρόπο. Στην πραγματικότητα, θα εκπλαγείτε πόσο εύκολο είναι να φτιάξετε τα δικά σας αντικείμενα JavaScript.

Η δημιουργία ενός νέου αντικειμένου συνεπάγεται δύο βήματα:

  • Ορίστε το αντικείμενο σε μια συνάρτηση που καθορίζεται από το χρήστη.
  • Χρησιμοποιήστε τη νέα λέξη-κλειδί για να δημιουργήσετε (ή να δημιουργήσετε) το αντικείμενο με μια κλήση στη λειτουργία αντικειμένου.

Ακολουθεί ένα παράδειγμα του απλούστερου αντικειμένου JavaScript που ορίζεται από τον κόσμο στον κόσμο:

// αυτό το μέρος δημιουργεί ένα νέο αντικείμενο ret = new makeSimpleObject ();

// αυτό το μέρος ορίζει τη συνάρτηση αντικειμένου makeSimpleObject () {}

Έχω ονομάσει το νέο αντικείμενο μουσκεύω; χρησιμοποιήστε οποιοδήποτε έγκυρο όνομα μεταβλητής για το νέο αντικείμενο (χρησιμοποιώ πεζά γράμματα για μεταβλητές που περιέχουν αντικείμενα, οπότε είναι ευκολότερο να πούμε ότι η μεταβλητή περιέχει ένα αντικείμενο).

Μπορείτε να χρησιμοποιήσετε την ίδια λειτουργία αντικειμένου για να δημιουργήσετε οποιονδήποτε αριθμό νέων αντικειμένων. Για παράδειγμα, αυτές οι γραμμές δημιουργούν τέσσερα νέα και ξεχωριστά αντικείμενα: eenie, meenie, minie και moe:

eenie = νέο makeSimpleObject (); meenie = νέο makeSimpleObject (); minie = νέο makeSimpleObject (); moe = νέο makeSimpleObject (); 

Στην πραγματικότητα, υπάρχει ακόμη μια συντόμευση στο παραπάνω "απλούστερο αντικείμενο JavaScript στον κόσμο". Δεν χρειάζεται να ορίσετε μια συνάρτηση αντικειμένου για να φτιάξετε ένα αντικείμενο με γυμνά οστά. Το JavaScript υποστηρίζει ένα γενικό αντικείμενο Object (), το οποίο μπορείτε να χρησιμοποιήσετε για να δημιουργήσετε νέα αντικείμενα. Το ακόλουθο κάνει το ίδιο με τα παραπάνω, χωρίς λειτουργία ρητού αντικειμένου:

eenie = νέο αντικείμενο (); 

Ορισμός νέων ιδιοτήτων σε ήδη κατασκευασμένα αντικείμενα