Ich bitte um Entschuldigung, wenn diese Frage zu weit gefasst ist. In der Tat sind es 4 verschiedene Fragen, aber alle beziehen sich auf den gleichen Code, und ich denke, sie alle drehen sich um dasselbe Prinzip.
Ich entschied mich heute, nachdem ich JS jahrelang benutzt hatte, tatsächlich zu lernen, wie JS funktioniert, anstatt es wie C zu behandeln, das im Browser läuft. Also beginne ich mit dem jQuery-Code, um zu sehen, wie echte JS-Entwickler die Sprache verwenden. Das ist, als ich einen Block des Codes fand, der wie der Code unten aussieht. Hinweis, ich habe diesen Code aus einem anderen gestapelten Beitrag hier In Javascript, können Sie die erweitern DOM? . Das bedeutet nicht, dass die Person, die diesen Code geschrieben hat, überhaupt wusste, wovon er redete.
%Vor%1 Warum deklarieren Sie die Funktion mit var myDOM = (function () {}) (); anstelle von var myDOM = function () {};
2 Warum deklariert eine andere -Funktion innerhalb der myDOM-Funktion mit exakt demselben Namen? Warum nicht die gesamte myDOM-Logik in die äußere myDOM-Funktion einfügen?
3 Warum explizit "this" zurückgeben? Das wäre automatisch gemacht worden, richtig?
4 Was ist hier los? Gibt es den Konstruktor des inneren myDOM zurück? Wenn ja, warum?
Aktualisieren
Also macht das meiste jetzt Sinn. Bezüglich # 1 dachte ich, dass myDOM die nach dem = definierte Funktion zugewiesen wurde, aber das ist es nicht. Es wird zugewiesen, was auch immer diese Funktion zurückgibt. Das ist nur eine Funktion.
Ich bin immer noch nicht klar auf # 3. Ja, ich verstehe die Verwendung der Funktion wie folgt
%Vor%Würde 'undefiniert' anzeigen. Aber so wird es nicht verwendet. Ein paar Zeilen nach oben ist das
%Vor%Ich kann es verstehen, dass ich explizit "das" zurückgebe, wenn die Aussage so lautet
%Vor%Aber das ist nicht der Fall.
Warum deklarieren Sie die Funktion mit var myDOM = (function () {}) (); anstelle von var myDOM = function () {};
Das ist ein so genannter self-invoking anonymous function oder self-executing anonymous function . Es tut genau das, es nennt sich zur Laufzeit. Sie sehen auch das Muster:
ziemlich viel in der jQuery Welt. Es ist das gleiche, zur Laufzeit ruft sich die Funktion selbst auf und garantiert, dass das $ -Zeichen einen Verweis auf jQuery -Objekt innerhalb des Funktionskörpers hat.
In Ihrem Snippet ruft die Funktion sich selbst auf und gibt myDOM , eine Funktionsreferenz, zurück.
Warum sollte eine andere Funktion innerhalb der myDOM-Funktion mit exakt demselben Namen deklariert werden? Warum nicht die gesamte myDOM-Logik in die äußere myDOM-Funktion einfügen?
Das ist nur eine Konvention. Es könnte so genannt werden, was immer Sie wollen, vielleicht dachte der Autor, dass es praktisch ist, dies zu tun. Der Grund für dieses Muster ist Privatsphäre & amp; Sicherheit. Durch das Zurückgeben der inneren myDOM -Referenz wird ein closure erstellt. Also nach dem Erklären etwas wie
Sie haben keinen Zugriff auf MyDOMConstruct , aber Ihre innere Funktion hat Zugriff. Auf diese Weise können Sie Ihre Methoden und Variablen schützen. Es wird auch method pattern genannt. Immer eine gute Lektüre in diesem Zusammenhang Douglas Crockford: Javascript the good parts .
Warum explizit "this" zurückgeben? Das wäre automatisch erledigt worden, richtig?
Nein, eine Funktion gibt standardmäßig den Wert undefined zurück. Durch explizite Rückgabe von this können Sie chain die Methoden wie (aus dem obigen Beispiel Aufruf):
, da jede Methode das Objekt des Aufrufs zurückgibt, in diesem Fall myDOM .
Was ist hier los? Gibt es den Konstruktor des inneren myDOM zurück? Wenn ja, warum?
Ich hoffe, dass das an diesem Punkt klar sein sollte.
Bearbeiten
Basierend auf Ihrem Update:
%Vor% erzeugt ein neues Objekt, das inherits von
Ohne das new keyword wäre das this nicht an das neue Objekt gebunden. Stattdessen wäre es an das globale Objekt (Fenster) gebunden, und Sie würden mit this auf globale Variablen zugreifen.
1. Warum deklarieren Sie die Funktion mit var myDOM = (function() {})(); anstelle von var myDOM = function() {};
Das verwendete Formular ist eine selbstausführende Funktion. Dies bedeutet, dass myDOM auf das festgelegt ist, was die Funktion zurückgibt. Das zweite Formular setzt myDOM auf die Funktion, führt die Funktion jedoch nicht sofort aus.
%Vor%
2. Warum sollte innerhalb der myDOM-Funktion mit genau demselben Namen eine andere Funktion deklariert werden? Warum nicht die gesamte myDOM-Logik in die äußere myDOM-Funktion einfügen?
Weil Sie die innere myDOM-Funktion am Ende zurückgeben .... also macht die Benennung tatsächlich Sinn, obwohl sie zunächst verwirrend ist. Dies wird oft verwendet, um private Variablen in JS zu erstellen. Da die innere Funktion Zugriff auf den Bereich hat, in dem sie eingeschlossen ist (die selbstausführende anonyme Funktion), aber der Benutzer nicht.
%Vor% Also könnte das innere Objekt nichts heißen, und es könnte mit myDOM() ausgeführt werden, aber wenn Sie die innere Funktion blah noch benennen, können Sie es trotzdem ausführen, indem Sie myDOM() verwenden ... das ist nicht sehr klar ... viel besser, es gleich zu nennen.
3. Warum explizit "this" zurückgeben? Das wäre automatisch erledigt worden, richtig?
Nein, wenn Sie nichts schreiben, gibt Javascript automatisch undefined zurück. Die MDC-Referenz: .
Die Rückgabe von this wird oft verwendet, um den Kontext einer Methode zu erhalten. Früher wurde die Verkettung von Methoden ( $(here).is().a().chain().of().methods() ) möglich. So dass eine Methode in der Kette den Kontext kennt, in dem sie arbeitet.
Nur noch eine Anmerkung zu der selbstausführenden anonymen Funktion . Das Einbetten einiger JavaScript-Teile in einen (function() { })(); -Block ist eine Möglichkeit, einen privaten Namespace zu erstellen. Alles, was Sie innerhalb der inneren Funktion tun, wird bis auf den zurückgegebenen Wert (in diesem Fall myDOM ) die Funktion private sein.
Das ist sicher, dass Sie Dinge wie
tun können %Vor% um einen inneren Zustand außerhalb der Funktion geheim zu halten. Der zweite Grund, wie bereits in anderen Beiträgen angegeben, ist, dass er den globalen Namensraum nicht mit der Variablen i belasten wird. Das ist der Grund, warum es am besten ist, diese Art von Funktionen in jQuery-Plugin-Entwicklung zu verwenden.
zum Beispiel: var fn = (funktion () { Rückgabefunktion () {alert (11)}; }) (); Wenn der Code ausgeführt wird, wird jetzt die Funktion fn = function () {alert (11)}; probier es aus !!!
Tags und Links javascript jquery