Heim Web-Frontend Front-End-Fragen und Antworten Was ist der Unterschied zwischen CommonJS- und ES6-Modularität?

Was ist der Unterschied zwischen CommonJS- und ES6-Modularität?

Mar 07, 2022 pm 06:58 PM
es6 模块化

Unterschiede: 1. CommonJS-Module werden zur Laufzeit geladen, während ES6-Module zur Kompilierungszeit Ausgabeschnittstellen sind. 2. require() des CommonJS-Moduls lädt Module synchron, während der Importbefehl des ES6-Moduls asynchron lädt. 3. CommonJS ist eine flache Kopie von Modulen , ES6 ist die Einführung von Modulen.

Was ist der Unterschied zwischen CommonJS- und ES6-Modularität?

Die Betriebsumgebung dieses Tutorials: Windows 7-System, ECMAScript Version 6, Dell G3-Computer.

CommonJS

  • Für grundlegende Datentypen handelt es sich um eine Kopie. Das heißt, es wird vom Modul zwischengespeichert. Gleichzeitig können die von diesem Modul ausgegebenen Variablen in einem anderen Modul neu zugewiesen werden.

  • Bei komplexen Datentypen handelt es sich um eine flache Kopie. Da die von den beiden Modulen referenzierten Objekte auf denselben Speicherplatz verweisen, wirken sich Änderungen am Wert des Moduls auf das andere Modul aus.

  • Wenn ein Modul mit dem Befehl require geladen wird, wird der Code des gesamten Moduls ausgeführt.

  • Wenn der Befehl require zum Laden desselben Moduls verwendet wird, wird das Modul nicht erneut ausgeführt, sondern der Wert im Cache wird abgerufen. Mit anderen Worten: Unabhängig davon, wie oft das CommonJS-Modul geladen wird, wird es beim ersten Laden nur einmal ausgeführt. Wenn es später geladen wird, wird das Ergebnis des ersten Laufs zurückgegeben, es sei denn, der Systemcache ist vorhanden manuell gelöscht.

  • Beim Laden in einer Schleife wird es beim Laden ausgeführt. Das heißt, wenn der Skriptcode erforderlich ist, wird er vollständig ausgeführt. Sobald ein Modul „in einer Schleife geladen“ ist, wird nur der ausgeführte Teil ausgegeben und der nicht ausgeführte Teil wird nicht ausgegeben.

ES6-Modul

  • Die Werte im ES6-Modul gehören zu [dynamische schreibgeschützte Referenz].

  • Für schreibgeschützt, das heißt, der Wert der importierten Variablen darf nicht geändert werden. Die importierte Variable ist schreibgeschützt, unabhängig davon, ob es sich um einen Basisdatentyp oder einen komplexen Datentyp handelt. Wenn ein Modul auf einen Importbefehl trifft, wird eine schreibgeschützte Referenz generiert. Wenn das Skript tatsächlich ausgeführt wird, wird der Wert basierend auf dieser schreibgeschützten Referenz aus dem geladenen Modul abgerufen.

  • Wenn sich bei Dynamiken der ursprüngliche Wert ändert, ändert sich auch der durch den Import geladene Wert. Ob es sich um einen Basisdatentyp oder einen komplexen Datentyp handelt.

  • Beim Laden in einer Schleife werden ES6-Module dynamisch referenziert. Solange zwischen den beiden Modulen eine Referenz besteht, kann der Code ausgeführt werden.

Der Unterschied zwischen ES6-Modulen und CommonJS-Modulen

1 CommonJS-Module werden zur Laufzeit geladen, während ES6-Module zur Kompilierungszeit Ausgabeschnittstellen sind.

2. Der Befehl require() des CommonJS-Moduls lädt das Modul synchron, während der Importbefehl des ES6-Moduls asynchron lädt, mit einer unabhängigen Auflösungsphase für Modulabhängigkeiten.

3. CommonJS ist eine flache Kopie des Moduls, und das ES6-Modul ist nur schreibgeschützt und kann seinen Wert nicht ändern , ähnlich wie const.

4. Die Importschnittstelle ist schreibgeschützt (Nur-Lese-Status) und ihr Variablenwert kann nicht geändert werden. Das heißt, der Zeiger, der auf seine Variable zeigt, kann nicht geändert werden, der interne Zeiger, der auf die Variable zeigt, kann jedoch geändert werden. Sie können ein commonJS-Paar neu zuweisen (die Zeigerrichtung ändern), aber die Zuweisung eines Werts zu einem ES6-Modul führt zu einem Kompilierungsfehler.

Was ES6-Module und CommonJS-Module gemeinsam haben:

1. Sowohl CommonJS- als auch ES6-Module können importierten Objekten Werte zuweisen, also die Werte der internen Eigenschaften der Objekte ändern.

【Verwandte Empfehlungen: Javascript-Video-Tutorial, Web-Frontend

Das obige ist der detaillierte Inhalt vonWas ist der Unterschied zwischen CommonJS- und ES6-Modularität?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn

Heiße KI -Werkzeuge

Undresser.AI Undress

Undresser.AI Undress

KI-gestützte App zum Erstellen realistischer Aktfotos

AI Clothes Remover

AI Clothes Remover

Online-KI-Tool zum Entfernen von Kleidung aus Fotos.

Undress AI Tool

Undress AI Tool

Ausziehbilder kostenlos

Clothoff.io

Clothoff.io

KI-Kleiderentferner

AI Hentai Generator

AI Hentai Generator

Erstellen Sie kostenlos Ai Hentai.

Heißer Artikel

R.E.P.O. Energiekristalle erklärten und was sie tun (gelber Kristall)
2 Wochen vor By 尊渡假赌尊渡假赌尊渡假赌
Repo: Wie man Teamkollegen wiederbelebt
4 Wochen vor By 尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island Abenteuer: Wie man riesige Samen bekommt
4 Wochen vor By 尊渡假赌尊渡假赌尊渡假赌

Heiße Werkzeuge

Notepad++7.3.1

Notepad++7.3.1

Einfach zu bedienender und kostenloser Code-Editor

SublimeText3 chinesische Version

SublimeText3 chinesische Version

Chinesische Version, sehr einfach zu bedienen

Senden Sie Studio 13.0.1

Senden Sie Studio 13.0.1

Leistungsstarke integrierte PHP-Entwicklungsumgebung

Dreamweaver CS6

Dreamweaver CS6

Visuelle Webentwicklungstools

SublimeText3 Mac-Version

SublimeText3 Mac-Version

Codebearbeitungssoftware auf Gottesniveau (SublimeText3)

Ist Async für es6 oder es7? Ist Async für es6 oder es7? Jan 29, 2023 pm 05:36 PM

async ist es7. Async und Wait sind neue Ergänzungen zu ES7 und Lösungen für asynchrone Vorgänge. Man kann sagen, dass Async/Await syntaktischer Zucker für Co-Module und Generatorfunktionen ist und js asynchronen Code mit klarerer Semantik löst. Wie der Name schon sagt, bedeutet Async „asynchron“. Async wird verwendet, um zu deklarieren, dass eine Funktion asynchron ist. Es gibt eine strikte Regel zwischen Async und Wait.

So optimieren Sie die Wartbarkeit von Java-Code: Erfahrungen und Ratschläge So optimieren Sie die Wartbarkeit von Java-Code: Erfahrungen und Ratschläge Nov 22, 2023 pm 05:18 PM

So optimieren Sie die Wartbarkeit von Java-Code: Erfahrungen und Ratschläge Im Softwareentwicklungsprozess ist das Schreiben von Code mit guter Wartbarkeit von entscheidender Bedeutung. Wartbarkeit bedeutet, dass Code leicht verstanden, geändert und erweitert werden kann, ohne dass es zu unerwarteten Problemen oder zusätzlichem Aufwand kommt. Für Java-Entwickler ist die Optimierung der Wartbarkeit von Code ein wichtiges Thema. In diesem Artikel werden einige Erfahrungen und Vorschläge geteilt, um Java-Entwicklern dabei zu helfen, die Wartbarkeit ihres Codes zu verbessern. Befolgen Sie standardisierte Benennungsregeln. Standardmäßige Benennungsregeln können die Lesbarkeit des Codes verbessern.

Wie kann der Fehler der schlechten Wartbarkeit von Python-Code behoben werden? Wie kann der Fehler der schlechten Wartbarkeit von Python-Code behoben werden? Jun 25, 2023 am 11:58 AM

Python wird als höhere Programmiersprache häufig in der Softwareentwicklung verwendet. Obwohl Python viele Vorteile bietet, besteht ein Problem, mit dem viele Python-Programmierer häufig konfrontiert sind, darin, dass der Code weniger wartbar ist. Die Wartbarkeit von Python-Code umfasst die Lesbarkeit, Skalierbarkeit und Wiederverwendbarkeit des Codes. In diesem Artikel konzentrieren wir uns darauf, wie das Problem der schlechten Wartbarkeit von Python-Code gelöst werden kann. 1. Lesbarkeit des Codes Die Lesbarkeit des Codes bezieht sich auf die Lesbarkeit des Codes, die den Kern der Wartbarkeit des Codes darstellt.

Was bedeutet die temporäre Totzone von es6? Was bedeutet die temporäre Totzone von es6? Jan 03, 2023 pm 03:56 PM

In es6 handelt es sich bei der temporären Totzone um einen Syntaxfehler, der sich auf die Befehle let und const bezieht, die dafür sorgen, dass der Block einen geschlossenen Bereich bildet. Bevor eine Variable innerhalb eines Codeblocks mit dem Befehl let/const deklariert wird, ist sie nicht verfügbar und gehört zur „toten Zone“ der Variablen, bevor die Variable deklariert wird. ES6 legt fest, dass die Variablenheraufstufung in temporären Totzonen und in let- und const-Anweisungen nicht erfolgt, hauptsächlich um Laufzeitfehler zu reduzieren und zu verhindern, dass die Variable vor ihrer Deklaration verwendet wird, was zu unerwartetem Verhalten führen kann.

So implementieren Sie die Array-Deduplizierung in es5 und es6 So implementieren Sie die Array-Deduplizierung in es5 und es6 Jan 16, 2023 pm 05:09 PM

In es5 können Sie die for-Anweisung und die Funktion indexOf() verwenden, um eine Array-Deduplizierung zu erreichen. Die Syntax „for(i=0;i<array length;i++){a=newArr.indexOf(arr[i]);if( a== -1){...}}". In es6 können Sie den Spread-Operator Array.from() und Set verwenden, um Duplikate zu entfernen. Sie müssen zuerst das Array in ein Set-Objekt konvertieren, um Duplikate zu entfernen, und dann den Spread-Operator oder die Funktion Array.from() verwenden Konvertieren Sie das Set-Objekt zurück in ein Array.

Wie kann der Codekomplexitätsfehler im Python-Code behoben werden? Wie kann der Codekomplexitätsfehler im Python-Code behoben werden? Jun 24, 2023 pm 05:43 PM

Python ist eine einfache, leicht zu erlernende und effiziente Programmiersprache. Wenn wir jedoch Python-Code schreiben, können Probleme mit übermäßiger Codekomplexität auftreten. Wenn diese Probleme nicht gelöst werden, wird es schwierig, den Code zu warten, fehleranfällig zu machen und die Lesbarkeit und Skalierbarkeit des Codes zu verringern. In diesem Artikel besprechen wir daher, wie man Codekomplexitätsfehler in Python-Code beheben kann. Verständnis der Codekomplexität Die Codekomplexität ist ein Maß für die Art des Codes, der schwer zu verstehen und zu warten ist. In Python gibt es einige Indikatoren, die verwendet werden können

Wird der ES6-Import Variablen fördern? Wird der ES6-Import Variablen fördern? Jan 18, 2023 pm 07:44 PM

Der ES6-Import führt zu einer Variablenheraufstufung. Beim Hochziehen von Variablen wird eine Variablendeklaration an den Anfang ihres Gültigkeitsbereichs verschoben. js muss die Kompilierungs- und Ausführungsphase durchlaufen. Während der Kompilierungsphase werden alle Variablendeklarationen im Voraus erfasst, während andere Anweisungen ihre Reihenfolge nicht ändern ausgeführt, und der zweite Teil wird nur ausgeführt, wenn die Anweisung in der Ausführungsphase ausgeführt wird.

So verwenden Sie die Go-Sprache für die Praxis der Code-Modularisierung So verwenden Sie die Go-Sprache für die Praxis der Code-Modularisierung Aug 03, 2023 am 10:31 AM

So verwenden Sie die Go-Sprache für die Praxis der Code-Modularisierung: In der Softwareentwicklung ist die Code-Modularisierung eine gängige Entwicklungsmethode. Durch die Aufteilung des Codes in wiederverwendbare Module können die Wartbarkeit, Testbarkeit und Wiederverwendbarkeit des Codes verbessert werden. In diesem Artikel wird die Verwendung der Go-Sprache zum Üben der Codemodularisierung vorgestellt und entsprechende Codebeispiele bereitgestellt. 1. Die Vorteile der Modularisierung verbessern die Wartbarkeit des Codes: Durch die Modularisierung wird der Code in unabhängige Funktionsmodule unterteilt, und jedes Modul ist für bestimmte Aufgaben verantwortlich, wodurch der Code klarer und einfacher zu ändern ist. Der Code kann verbessert werden

See all articles