Σήμερα, η JavaScript παίζει τεράστιο ρόλο στην ανάπτυξη ιστοσελίδων. Οι προγραμματιστές front-end χρησιμοποιούν JavaScript για να δημιουργήσουν διαδραστικές εφαρμογές Ιστού. Ως αποτέλεσμα, υπήρξε αύξηση της ζήτησης για προγραμματιστές JavaScript.
Σίγουρα, η JavaScript έχει εξελιχθεί με τα χρόνια. Το ES6 εισήγαγε πολλές νέες δυνατότητες στη γλώσσα. Ένα από αυτά είναι ένας τρόπος για εύκολη κοινή χρήση κωδικών μεταξύ αρχείων JavaScript.
Η εισαγωγή και η εξαγωγή συναρτήσεων για JavaScript είναι νέες δυνατότητες που θα σας κάνουν καλύτερο προγραμματιστή. Δείτε πώς λειτουργούν αυτές οι δυνατότητες.
Τι είναι μια λειτουργική μονάδα JavaScript;
Μια λειτουργική μονάδα JavaScript είναι ένα αρχείο JavaScript που περιέχει μια συλλογή κώδικα που μπορείτε να χρησιμοποιήσετε. Τα modules συνήθως γράφονται σε ξεχωριστά αρχεία και εισάγονται χρησιμοποιώντας το εισαγωγή λέξη-κλειδί. Εξοικονομεί χρόνο και προσπάθεια γιατί μπορείτε να το ξαναχρησιμοποιήσετε αργότερα.
Για παράδειγμα, εάν έχετε καλέσει μια συνάρτηση
υπολογισμός Άθροισμα(), μπορείτε να το συμπεριλάβετε σε άλλο αρχείο και να το κάνετε διαθέσιμο οπουδήποτε στο έργο σας χρησιμοποιώντας το εξαγωγή και εισαγωγή Η JavaScript λειτουργεί χωρίς φασαρία.Ένα από τα πλεονεκτήματα της χρήσης λειτουργικών μονάδων είναι ότι βοηθά να διατηρείτε τον κώδικά σας οργανωμένο. Κάνει επίσης τον κώδικά σας πιο διαχειρίσιμο και ευκολότερο στον εντοπισμό σφαλμάτων.
Για να χρησιμοποιήσετε ένα αρχείο JavaScript ως λειτουργική μονάδα, πρέπει να δημιουργήσετε ένα σενάριο στο έγγραφό σας HTML με type="module".
<τύπος σεναρίου="μονάδα μέτρησης" src="fileName.js"></script>
Υπάρχουν δύο τύποι ενοτήτων:
- Ενότητες ECMAScript: τυπικές λειτουργικές μονάδες JavaScript και υποστηρίζονται από όλα τα μεγάλα προγράμματα περιήγησης.
- Ενότητες CommonJS: είναι παλαιότερες και δεν υποστηρίζονται ευρέως.
Θα επικεντρωθούμε στις Ενότητες ECMAScript εδώ. Αν χρειαστεί, δείτε το δικό μας εισαγωγή στη JavaScript για να αναλύσουμε τα βασικά.
Τρόπος εξαγωγής συναρτήσεων σε JavaScript
Στο JavaScript, οι συναρτήσεις είναι αντικείμενα πρώτης κατηγορίας που μπορούν να περάσουν ως ορίσματα εκτός από το να χρησιμοποιηθούν μόνες τους. Η εξαγωγή συναρτήσεων είναι ένας καλός τρόπος για να τις μεταφέρετε σε άλλα προγράμματα. Χρησιμοποιείται επίσης όταν θέλετε να δημιουργήσετε επαναχρησιμοποιήσιμες βιβλιοθήκες.
Η εξαγωγή συναρτήσεων σε JavaScript γίνεται χρησιμοποιώντας το εξαγωγή λειτουργία. ο εξαγωγή Η συνάρτηση εξάγει μια δεδομένη συνάρτηση για χρήση από άλλο αρχείο ή σενάριο. Με εξαγωγές τις δικές μας λειτουργίες, μπορούμε να τα χρησιμοποιήσουμε ελεύθερα σε άλλα αρχεία ή σενάρια χωρίς να ανησυχούμε για ζητήματα αδειοδότησης.
Υπάρχουν δύο τρόποι χρήσης του εξαγωγή λειτουργούν αποτελεσματικά. Θα τα εξετάσουμε με παραδείγματα κώδικα.
Ας υποθέσουμε ότι έχετε ένα αρχείο getPersonalDetails.js που έχει μια συνάρτηση που επιστρέφει το πλήρες όνομα ενός χρήστη μετά από μια άμεση εισαγωγή. Η συνάρτηση μοιάζει με αυτό:
λειτουργίαgetFullName(πλήρες όνομα){
πλήρες όνομα = προτροπή ('Ποιο είναι το μικρό σου όνομα');
κονσόλα.log (πλήρες όνομα);
}
- Μπορείτε να εξαγάγετε αυτήν τη λειτουργία χρησιμοποιώντας απλά το εξαγωγή λέξη-κλειδί ακολουθούμενη από το όνομα της συνάρτησης σε σγουρές αγκύλες. Μοιάζει με αυτό:
εξαγωγή {getFullName}; - Η δεύτερη μέθοδος είναι να προσθέσετε το εξαγωγή λέξη-κλειδί λίγο πριν δηλώσετε τη συνάρτηση.
εξαγωγήλειτουργίαgetFullName (πλήρες όνομα){...}
Μπορείτε να εξαγάγετε πολλές συναρτήσεις χρησιμοποιώντας την πρώτη μέθοδο. Αυτό γίνεται με τη συμπερίληψη των ονομάτων των επιθυμητών συναρτήσεων στη σγουρή αγκύλη. Οι συναρτήσεις χωρίζονται με κόμμα.
Για παράδειγμα: Ας υποθέσουμε ότι έχετε τρεις συναρτήσεις στο δικό μας getPersonalDetails.js αρχείο - getFullName(),getEmail(), getDob(). Μπορείτε να εξαγάγετε τις συναρτήσεις προσθέτοντας την ακόλουθη γραμμή κώδικα:
εξαγωγή {getFullName, getEmail, getDob};
Τρόπος εισαγωγής συναρτήσεων σε JavaScript
Για να χρησιμοποιήσετε μια ενότητα, πρέπει πρώτα να την εισαγάγετε. Οποιαδήποτε συνάρτηση μπορεί να εισαχθεί χρησιμοποιώντας μια αναφορά πλήρους διαδρομής.
Η εισαγωγή λειτουργιών είναι αρκετά απλή. Η JavaScript έχει μια ενσωματωμένη δυνατότητα εισαγωγής των δικών σας συναρτήσεων από άλλα αρχεία. Εάν θέλετε να αποκτήσετε πρόσβαση σε αυτές τις λειτουργίες από άλλες λειτουργικές μονάδες, είναι καλή ιδέα να συμπεριλάβετε μια δήλωση συνάρτησης για κάθε βοηθητικό πρόγραμμα.
Μια συνάρτηση προς εισαγωγή έχει ήδη εξαχθεί στο αρχικό της αρχείο.
Μπορείτε να εισαγάγετε συναρτήσεις από διαφορετικό αρχείο χρησιμοποιώντας το εισαγωγή λειτουργικότητα λέξης-κλειδιού. Εισαγωγή σας επιτρέπει να επιλέξετε ποιο μέρος ενός αρχείου ή μιας μονάδας θα φορτώσετε.
Δείτε πώς εισάγετε το δικό μας getFullName λειτουργία από getPersonalDetails.js:
εισαγωγή {getFullName} από "./getPersonalDetails.js"Αυτό θα κάνει αυτή τη λειτουργία διαθέσιμη για χρήση στο τρέχον αρχείο μας.
Για την εισαγωγή πολλαπλών συναρτήσεων, οι προς εισαγωγή συναρτήσεις περιλαμβάνονται στα σγουρά σιδεράκια. Κάθε ένα χωρίζεται με κόμμα (,).
εισαγωγή {getFullName, getEmail, getDob} από "./getPersonalDetails.js"Υπάρχει άλλος τρόπος χρήσης του εισαγωγή λειτουργικότητα. Αυτό μας επιτρέπει να εισάγουμε όλες τις εξαγωγές σε ένα συγκεκριμένο αρχείο. Γίνεται χρησιμοποιώντας το εισαγωγή * ως σύνταξη.
Μπορείτε να εισάγετε όλες τις εξαγωγές στο δικό μας getPersonalDetails.js προσθέτοντας την ακόλουθη γραμμή κώδικα:
εισαγωγή * όπως και personalDetailsModule από "./getPersonalDetails.js"Τα παραπάνω θα δημιουργήσουν ένα αντικείμενο που ονομάζεται personalDetailsModule.
Αυτό είναι απλώς ένα όνομα μεταβλητής, μπορείτε να το ονομάσετε οτιδήποτε.
Αυτό το αντικείμενο περιέχει όλες τις εξαγωγές στο δικό μας getPersonalDetails.js. Οι συναρτήσεις αποθηκεύονται σε αυτό το αντικείμενο και μπορούν να προσπελαστούν με τον τρόπο που έχετε πρόσβαση σε οποιαδήποτε ιδιότητα αντικειμένου.
Για παράδειγμα, μπορούμε να έχουμε πρόσβαση στο getFullName λειτουργία προσθέτοντας την ακόλουθη γραμμή κώδικα
personalDetailsModule.getFullName();Τι είναι η προεπιλογή εξαγωγής;
Προεπιλογή εξαγωγής είναι μια εξαιρετική λειτουργία εξαγωγής. Αυτό χρησιμοποιείται εάν εξάγεται μόνο μία μεταβλητή από ένα αρχείο. Χρησιμοποιείται επίσης για τη δημιουργία μιας εναλλακτικής τιμής για ένα αρχείο ή λειτουργική μονάδα.
Παρακάτω είναι ένα παράδειγμα όπου χρησιμοποιήσαμε το getFullName λειτουργεί ως προεπιλογή:
εξαγωγήΠροκαθορισμένολειτουργίαgetFullName (πλήρες όνομα){...}Δεν μπορείτε να έχετε περισσότερες από μία τιμές ως προεπιλογή σε κάθε λειτουργική μονάδα ή αρχείο.
Μια συνάρτηση που χρησιμοποιείται ως προεπιλογή εισάγεται διαφορετικά. Δείτε πώς να εισάγετε το δικό μας getFullName συνάρτηση που χρησιμοποιείται ως προεπιλογή:
εισαγωγή πλήρες όνομα από "./getPersonalDetails.js"Εδώ είναι οι διαφορές:
- Δεν υπάρχουν σγουρές τιράντες γύρω από την εισαγόμενη τιμή, πλήρες όνομα.
- πλήρες όνομα εδώ είναι απλώς ένα όνομα μεταβλητής. Αποθηκεύει την τιμή οποιασδήποτε προεπιλεγμένης συνάρτησης.
Φορτίστε τις λειτουργίες JavaScript σας
Οι λειτουργικές μονάδες JavaScript είναι κομμάτια κώδικα που μπορούν να επαναχρησιμοποιηθούν σε άλλα μέρη του κώδικά σας, χρησιμοποιώντας τις λειτουργίες εισαγωγής και εξαγωγής JavaScript. Συνήθως γράφονται σε ξεχωριστά αρχεία και εισάγονται χρησιμοποιώντας τη λέξη-κλειδί εισαγωγής. Ένα από τα πλεονεκτήματα της χρήσης λειτουργικών μονάδων είναι ότι βοηθά να διατηρείτε τον κώδικά σας οργανωμένο. Κάνει επίσης τον κώδικά σας πιο διαχειρίσιμο και ευκολότερο στον εντοπισμό σφαλμάτων.
