Modulare JavaScript-Programmierung (2): AMD-Spezifikation

Im ersten Teil dieser Serie wurde die grundlegende Schreibmethode des Javascript-Moduls vorgestellt. Heute stellen wir vor, wie das Modul auf standardisierte Weise verwendet wird.

(Fortsetzung von oben)

7. Modulspezifikationen

Überlegen Sie zunächst, warum Module wichtig sind?

Aufgrund der Module können wir den Code anderer Leute bequemer verwenden und beliebige Module für beliebige Funktionen laden.

Hierfür gibt es allerdings eine Voraussetzung, das heißt, jeder muss das Modul gleich schreiben, sonst hast du deine Art zu schreiben, und ich habe meine Art zu schreiben, wäre das nicht eine Durcheinander! Dies ist umso wichtiger, wenn man bedenkt, dass es noch keine offizielle Spezifikation für Javascript-Module gibt.

Derzeit gibt es zwei beliebte Javascript-Modulspezifikationen: CommonJS und AMD. Ich werde hauptsächlich AMD vorstellen, aber ich werde mit CommonJS beginnen.

8. CommonJS

Im Jahr 2009 erstellte der amerikanische Programmierer Ryan Dahl das Projekt node.js, bei dem er die Sprache JavaScript für die serverseitige Programmierung verwendete.

Dies markiert die offizielle Geburtsstunde der „JavaScript modularisierten Programmierung“. Denn um ehrlich zu sein: In einer Browserumgebung ist das Fehlen von Modulen kein großes Problem. Schließlich ist die Komplexität von Webprogrammen begrenzt, aber auf der Serverseite müssen Module vorhanden sein, um mit dem Betriebssystem und anderen Anwendungen zu interagieren. sonst gibt es keine Möglichkeit.

Das Modulsystem von node.js wird unter Bezugnahme auf die CommonJS-Spezifikation implementiert. In CommonJS gibt es eine globale Methode require() zum Laden von Modulen. Vorausgesetzt, es gibt ein Mathematikmodul math.js, kann es wie folgt geladen werden.

var math = require('math');

Dann können Sie die vom Modul bereitgestellten Methoden aufrufen:

var math = require('math');
math.add(2,3); // 5

Da diese Serie hauptsächlich für die Browserprogrammierung gedacht ist und keine node.js beinhaltet, haben wir gewonnen. Mit CommonJS lässt sich nicht viel anfangen. Hier müssen wir lediglich wissen, dass require() zum Laden von Modulen verwendet wird.

9. Browserumgebung

Mit dem serverseitigen Modul möchte natürlich jeder das clientseitige Modul. Und am besten ist es, wenn beide kompatibel sind, sodass ein Modul ohne Modifikation sowohl auf dem Server als auch im Browser laufen kann.

Aufgrund einer wesentlichen Einschränkung ist die CommonJS-Spezifikation jedoch nicht für Browserumgebungen geeignet. Der Code im vorherigen Abschnitt wird ein großes Problem haben, wenn er in einem Browser ausgeführt wird. Können Sie ihn sehen?

var math = require('math');
math.add(2, 3);

Die zweite Zeile von math.add(2, 3) wird nach der ersten Zeile von require(‘math’) ausgeführt, Sie müssen also warten, bis math.js geladen ist. Das heißt, wenn das Laden lange dauert, bleibt die gesamte App einfach stehen und wartet.

Serverseitig stellt dies kein Problem dar, da alle Module auf der lokalen Festplatte gespeichert sind und synchron geladen werden können. Die Wartezeit ist die Lesezeit der Festplatte. Für Browser ist dies jedoch ein großes Problem, da die Module auf der Serverseite platziert sind und die Wartezeit von der Geschwindigkeit des Netzwerks abhängt. Es kann lange dauern und der Browser befindet sich im „suspendierten Tod“. Zustand.

Daher können browserseitige Module kein „synchrones Laden“ (synchron), sondern nur „asynchrones Laden“ (asynchron) verwenden. Dies ist der Hintergrund für die Geburt der AMD-Spezifikation.

10. AMD

AMD ist die Abkürzung für „Asynchronous Module Definition“, was „asynchrone Moduldefinition“ bedeutet. Es lädt Module asynchron und das Laden des Moduls hat keinen Einfluss auf die Ausführung nachfolgender Anweisungen. Alle Anweisungen, die von diesem Modul abhängen, werden in einer Rückruffunktion definiert. Diese Rückruffunktion wird erst ausgeführt, wenn der Ladevorgang abgeschlossen ist.

AMD verwendet auch die Anweisung require() zum Laden von Modulen, erfordert jedoch im Gegensatz zu CommonJS zwei Parameter:

require([module], callback);

Der erste Parameter [Modul] ist ein Array im Inneren Das Mitglied ist das zu ladende Modul; der zweite Parameter-Callback ist die Callback-Funktion nach erfolgreichem Laden. Wenn der vorherige Code in AMD-Form umgeschrieben wird, sieht er folgendermaßen aus:

require(['math'], function (math) {
　　math.add(2, 3);
});

math.add() und das Laden des Mathematikmoduls sind nicht synchronisiert und der Browser friert nicht ein. Daher ist AMD offensichtlich besser für die Browserumgebung geeignet.

Derzeit gibt es zwei Haupt-Javascript-Bibliotheken, die die AMD-Spezifikation implementieren: require.js und curl.js. Im dritten Teil dieser Serie wird die Verwendung von AMD näher erläutert und erläutert, wie modulare Programmierung durch die Einführung von require.js in die Praxis umgesetzt werden kann.

Das Obige ist der Inhalt der modularen JavaScript-Programmierung (2): AMD-Spezifikationen Weitere verwandte Inhalte finden Sie auf der chinesischen PHP-Website (www.php.cn)!