Πώς λειτουργούν τα modules στα ES Modules;

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

Αρχές λειτουργίας:

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

Κύκλος ζωής του module:

1. Κατασκευή: Ο πηγαίος κώδικας του module αναλύεται, εντοπίζονται οι εισαγωγές και εξαγωγές. Δημιουργείται ένα περίβλημα του module.
2. Φόρτωση: Φορτώνονται όλα τα εισαγόμενα modules. Αν η εξάρτηση δεν είναι στην cache, γίνεται αίτημα στο δίκτυο ή το σύστημα αρχείων.
3. Σύνδεση: Οι εισαγωγές και εξαγωγές συνδέονται. Οι μεταβλητές και οι συναρτήσεις από τα εισαγόμενα modules γίνονται διαθέσιμες για χρήση. Αν η εισαγωγή δεν μπορεί να επιλυθεί, ρίχνεται σφάλμα.
4. Εκτέλεση: Ο κώδικας του module εκτελείται. Όλες οι εξαγωγές τιμές γίνονται διαθέσιμες στα modules που τις εισάγουν.

Παραδείγματα:

// moduleA.js
export const name = 'Alice';
export function sayHello() {
  console.log(`Hello, ${name}!`);
}

// moduleB.js
import { name, sayHello } from './moduleA.js';

console.log(name); // Έξοδος: Alice
sayHello(); // Έξοδος: Hello, Alice!

Διαφορές με το CommonJS:

Χαρακτηριστικό	ES Modules	CommonJS
Σύνδεση	Στατική	Δυναμική
Φόρτωση	Ασύγχρονη (στον περιηγητή)	Συγχρονική (κατά προεπιλογή)
Εξαγωγή	export λέξη-κλειδί	module.exports
Εισαγωγή	import λέξη-κλειδί	require συνάρτηση
Χρήση	Στον περιηγητή και στο Node.js (πειραματικό)	Στο Node.js