Es gibt keine detaillierten Erklärungen, was es6 Import und Export genau unter der Haube macht. Jemand beschreibt den Import als schreibgeschützte Ansicht. Überprüfen Sie den Code unten:

// lib/counter.js
export let counter = 1;

export function increment() {
  counter++;
}

export function decrement() {
  counter--;
}


// src/main.js
import * as counter from '../../counter';

console.log(counter.counter); // 1
counter.increment();
console..log(counter.counter); // 2

Meine Frage ist, ob zwei Module das gleiche Zählermodul importieren und das erste Modul den Zähler inkrementiert. Wird das zweite Modul den Zähler auch als inkrementiert sehen? Was unter der Haube machen "Import" und "Export"? In welchem Kontext wird die Inkrementierungsfunktion ausgeführt? Was ist ein variables Objekt der Inkrementfunktion?

// lib/counter.js
export let counter = 1;

export function increment() {
  counter++;
}

export function decrement() {
  counter--;
}


// src/main1.js
import * as counter from '../../counter';

console.log(counter.counter); // 1
counter.increment();
console..log(counter.counter); // 2


// src/main2.js
import * as counter from '../../counter';
console.log(counter.counter); // what is the result of this, 1 or 2?

Es scheint mir, dass der "Export" ein globales Objekt erstellt, auf das von verschiedenen Modulen zugegriffen werden kann, und den Kontext der exportierten Funktion für dieses Objekt festlegt. Wenn dies der Fall ist, ist das Design für mich verkabelt, da die Module nicht wissen, was andere Module tun. Wenn zwei Module das gleiche Modul (Zähler) importieren, ruft ein Modul die Inkrementierungsfunktion (Beispiel oben) auf, die zur Änderung des Werts (Zähler) führt, das andere Modul weiß das nicht.