Ενότητες JavaScript

Σε αυτό το σεμινάριο, θα μάθετε για τις ενότητες σε JavaScript με τη βοήθεια παραδειγμάτων.

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

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

Ας υποθέσουμε, ένα αρχείο με το όνομα salam.js περιέχει τον ακόλουθο κώδικα:

 // exporting a function export function greetPerson(name) ( return `Hello $(name)`; )

Τώρα, για να χρησιμοποιήσετε τον κωδικό salam.js σε άλλο αρχείο, μπορείτε να χρησιμοποιήσετε τον ακόλουθο κώδικα:

 // importing greetPerson from greet.js file import ( greetPerson ) from './greet.js'; // using greetPerson() defined in greet.js let displayName = greetPerson('Jack'); console.log(displayName); // Hello Jack

Εδώ,

  • Η greetPerson()συνάρτηση στο salam.js εξάγεται χρησιμοποιώντας τη exportλέξη-κλειδί
     export function greetPerson(name) (… )
  • Στη συνέχεια, εισαγάγαμε greetPerson()σε άλλο αρχείο χρησιμοποιώντας τη importλέξη-κλειδί. Για να εισαγάγετε συναρτήσεις, αντικείμενα κ.λπ., πρέπει να τα τυλίξετε ( ).
     import ( greet ) from '/.greet.js';

Σημείωση : Μπορείτε να έχετε πρόσβαση σε εξαγόμενες λειτουργίες, αντικείμενα κ.λπ. μόνο από τη μονάδα. Πρέπει να χρησιμοποιήσετε τη exportλέξη-κλειδί για τη συγκεκριμένη λειτουργία, αντικείμενα κ.λπ. για να τις εισαγάγετε και να τις χρησιμοποιήσετε σε άλλα αρχεία.

Εξαγωγή πολλαπλών αντικειμένων

Είναι επίσης δυνατή η εξαγωγή πολλαπλών αντικειμένων από μια ενότητα. Για παράδειγμα,

Στο αρχείο module.js

 // exporting the variable export const name = 'JavaScript Program'; // exporting the function export function sum(x, y) ( return x + y; )

Στο κύριο αρχείο,

 import ( name, sum ) from './module.js'; console.log(name); let add = sum(4, 9); console.log(add); // 13

Εδώ,

 import ( name, sum ) from './module.js';

Αυτό εισάγει τόσο τη μεταβλητή ονόματος όσο και τη sum()συνάρτηση από το αρχείο module.js .

Μετονομασία εισαγωγών και εξαγωγών

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

Για να αποφύγετε συγκρούσεις ονομάτων, μπορείτε να μετονομάσετε αυτές τις συναρτήσεις, αντικείμενα κ.λπ. κατά την εξαγωγή ή κατά την εισαγωγή.

1. Μετονομασία στη λειτουργική μονάδα (αρχείο εξαγωγής)

 // renaming import inside module.js export ( function1 as newName1, function2 as newName2 ); // when you want to use the module // import in the main file import ( newName1, newName2 ) from './module.js';

Εδώ, κατά την εξαγωγή της συνάρτησης από το αρχείο module.js , δίνονται νέα ονόματα (εδώ, newName1 & newName2) στη συνάρτηση. Ως εκ τούτου, κατά την εισαγωγή αυτής της συνάρτησης, το νέο όνομα χρησιμοποιείται για αναφορά αυτής της συνάρτησης.

2. Μετονομασία στο αρχείο εισαγωγής

 // inside module.js export ( function1, function2 ); // when you want to use the module // import in the required file with different name import ( function1 as newName1, function2 as newName2 ) from './module.js';

Εδώ, κατά την εισαγωγή της συνάρτησης, τα νέα ονόματα (εδώ, newName1 & newName2) χρησιμοποιούνται για το όνομα της συνάρτησης. Τώρα χρησιμοποιείτε τα νέα ονόματα για να αναφέρετε αυτές τις συναρτήσεις.

Προεπιλεγμένη εξαγωγή

Μπορείτε επίσης να πραγματοποιήσετε προεπιλεγμένη εξαγωγή της μονάδας. Για παράδειγμα,

Στο αρχείο Salam.js :

 // default export export default function greet(name) ( return `Hello $(name)`; ) export const age = 23;

Στη συνέχεια, κατά την εισαγωγή, μπορείτε να χρησιμοποιήσετε:

 import random_name from './greet.js';

Κατά την εκτέλεση της προεπιλεγμένης εξαγωγής,

  • Το random_name εισάγεται από greet.js. Δεδομένου ότι, random_nameδεν είναι greet.js, η προεπιλεγμένη εξαγωγή ( greet()σε αυτήν την περίπτωση) εξάγεται ως random_name.
  • Μπορείτε να χρησιμοποιήσετε απευθείας την προεπιλεγμένη εξαγωγή χωρίς να περικλείσετε αγκύλες ().

Σημείωση : Ένα αρχείο μπορεί να περιέχει πολλές εξαγωγές. Ωστόσο, μπορείτε να έχετε μόνο μία προεπιλεγμένη εξαγωγή σε ένα αρχείο.

Οι μονάδες χρησιμοποιούν πάντα Αυστηρή λειτουργία

Από προεπιλογή, οι ενότητες βρίσκονται σε αυστηρή λειτουργία. Για παράδειγμα,

 // in greet.js function greet() ( // strict by default ) export greet();

Οφέλη από τη χρήση της ενότητας

  • Η βάση κώδικα είναι ευκολότερο να διατηρηθεί επειδή διαφορετικός κώδικας με διαφορετικές λειτουργίες βρίσκονται σε διαφορετικά αρχεία.
  • Κάνει τον κώδικα επαναχρησιμοποιήσιμο. Μπορείτε να ορίσετε μια ενότητα και να τη χρησιμοποιήσετε πολλές φορές ανάλογα με τις ανάγκες σας.

Η χρήση εισαγωγής / εξαγωγής ενδέχεται να μην υποστηρίζεται σε ορισμένα προγράμματα περιήγησης. Για να μάθετε περισσότερα, επισκεφθείτε την Υποστήριξη εισαγωγής / εξαγωγής JavaScript.

ενδιαφέροντα άρθρα...