$ (Dokument). bereits Kurzschrift

245

Ist die folgende Abkürzung für $(document).ready?

(function($){

//some code

})(jQuery);

Ich sehe, dass dieses Muster häufig verwendet wird, aber ich kann keinen Hinweis darauf finden. Wenn es eine Abkürzung ist $(document).ready(), gibt es einen bestimmten Grund, warum es möglicherweise nicht funktioniert? In meinen Tests scheint es immer vor dem fertigen Ereignis zu feuern.

Mark Brown
quelle
Jede Variable, die innerhalb der genannten Musterfunktion definiert ist (z. B. var somevar;), ändert den Inhalt gleichnamiger Variablen außerhalb der Funktion nicht
Timo Huovinen
3
Durch den Code wird sichergestellt, dass $ jQuery in diesem Funktionsblock darstellt, sodass der Code an Stellen portierbar ist, an denen der Alias ​​$ für jQuery deaktiviert oder als etwas anderes definiert ist.
AsksAnyway

Antworten:

252

Die Abkürzung für $(document).ready(handler)ist $(handler)(wo handlerist eine Funktion). Siehe hier .

Der Code in Ihrer Frage hat nichts damit zu tun .ready(). Es handelt sich vielmehr um einen sofort aufgerufenen Funktionsausdruck (IIFE) mit dem jQuery-Objekt als Argument. Der Zweck besteht darin, den Umfang mindestens der $Variablen auf ihren eigenen Block zu beschränken, damit keine Konflikte verursacht werden. Normalerweise sehen Sie das Muster, das von jQuery-Plugins verwendet wird, um dies sicherzustellen $ == jQuery.

BoltClock
quelle
14
Technisch gesehen handelt es sich um einen sofort aufgerufenen Funktionsausdruck . Wäre es selbstaufrufend, würde es sich von innen heraus anrufen. Durchsuchen Sie das Internet nach iifeoder springen Sie zum berühmten Blog-Beitrag von Cowboy Alman . Details ... meine Güte.
2540625
546

Die Abkürzung lautet:

$(function() {
    // Code here
});
Kyle Trauberman
quelle
24
Das erste Argument ist $. Vielleicht möchten Sie das hinzufügen. Es ist nützlich fürjQuery(function($, undefined) {});
Raynos
5
@raynos Es ist nicht erforderlich. Der obige Code funktioniert gut als Alias ​​für$(document).ready(function(){ });
Kyle Trauberman
10
Es ist nur nützlich zu wissen, dass Sie $als erstes Argument kostenlos erhalten.
Raynos
3
Ich besuche diese Antwort immer noch einmal im Monat oder so.
Nugsson
89

Die richtige Abkürzung lautet:

$(function() {
    // this behaves as if within document.ready
});

Der Code, den Sie gepostet haben…

(function($){

//some code

})(jQuery);

… Erstellt eine anonyme Funktion und führt sie sofort aus, jQueryindem sie als Argument übergeben wird $. Alles, was es effektiv tut, ist, den Code innerhalb der Funktion zu nehmen und ihn wie gewohnt auszuführen, da dies $bereits ein Alias ​​für ist jQuery. : D.

Gordon Gustafson
quelle
4
Man könnte sagen, dass es auch sicherstellt, dass $ der Alias ​​für jQuery ist, wenn andere Tools geladen werden, die $ auch als Alias ​​verwenden
Jim Wolff
16

Dies ist keine Abkürzung für $(document).ready().

Der von Ihnen veröffentlichte Code enthält den internen Code und stellt jQuery zur Verfügung, $ohne den globalen Namespace zu verschmutzen. Dies kann verwendet werden, wenn Sie sowohl Prototyp als auch jQuery auf einer Seite verwenden möchten.

Hier dokumentiert: http://learn.jquery.com/using-jquery-core/avoid-conflicts-other-libraries/#use-an-immedially-invoked-function-expression

Samy-Delux
quelle
Vielen Dank für die Beantwortung der Frage
MarcGuay
12

Diese spezifischen Zeilen sind der übliche Wrapper für jQuery-Plugins:

"... um sicherzustellen, dass Ihr Plugin nicht mit anderen Bibliotheken kollidiert, die möglicherweise das Dollarzeichen verwenden, empfiehlt es sich, jQuery an eine selbstausführende Funktion (Closure) zu übergeben, die es dem Dollarzeichen zuordnet, damit es ' im Rahmen ihrer Ausführung von einer anderen Bibliothek überschrieben werden. "

(function( $ ){
  $.fn.myPlugin = function() {
    // Do your awesome plugin stuff here
  };
})( jQuery );

Von http://docs.jquery.com/Plugins/Authoring

morgar
quelle
11

Die sichere Abkürzung für mehrere Frameworks ist:

jQuery(function($, undefined) {
    // $ is guaranteed to be short for jQuery in this scope
    // undefined is provided because it could have been overwritten elsewhere
});

Dies liegt daran, dass jQuery nicht das einzige Framework ist, das die Variablen $und verwendetundefined

Timo Huovinen
quelle
kann auch geschrieben werden als (function($){ ... })(jQuery);
Mike Causer
2
@ MikeCauser auch ein guter Ansatz, aber es wird nicht aufgerufen, sondern es wird readysofort aufgerufen
Timo Huovinen
5

Noch kürzere Variante ist zu verwenden

$(()=>{

});

wo $steht für jQuery und ()=>{}heißt so Pfeilfunktion , die thisvom Abschluss erbt . (So ​​dass thisSie wahrscheinlich in windowstatt haben document.)

Edvard Rejthar
quelle
0

Was ist damit?

(function($) { 
   $(function() {
     // more code using $ as alias to jQuery
     // will be fired when document is ready
   });
})(jQuery);
RN Kushwaha
quelle