web-dev-qa-db-ja.com

$(document).ready速記

次の$(document).readyの省略形はありますか?

(function($){

//some code

})(jQuery);

私はこのパターンが多用されているのを見ますが、私はそれへの参照を見つけることができません。 $(document).ready()の省略形である場合、それが機能しない可能性がある特別な理由はありますか?私のテストでは、準備ができているイベントの前に必ず発生するようです。

228
Mark Brown

$(document).ready(handler)の省略形は$(handler)です(ここでhandlerは関数です)。 ここ を参照してください。

あなたの質問のコードは.ready()とは関係ありません。そうではなく、jQueryオブジェクトを引数とする即時起動関数式(IIFE)です。その目的は、少なくとも$変数のスコープをそれ自身のブロックに制限して、競合が発生しないようにすることです。 $ == jQueryを確実にするためにjQueryプラグインによって使用されるパターンがよくわかります。

243
BoltClock

速記は次のとおりです。

$(function() {
    // Code here
});
511
Kyle Trauberman

正しい速記はこれです:

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

あなたが投稿したコード…

(function($){

//some code

})(jQuery);

…無名関数を作成し、引数$として渡されたjQueryを使用して直ちにそれを実行します。 $はすでにjQueryのエイリアスであるため、効果的にできることは関数内のコードを取得して通常どおりに実行することです。 :D

84

これは$(document).ready()の省略形ではありません。

あなたが投稿したコードは内側のコードを囲み、グローバルネームスペースを汚染することなくjQueryを$として利用可能にします。これは、プロトタイプとjQueryの両方を1ページで使用したい場合に使用できます。

ここに文書化されています: http://learn.jquery.com/using-jquery-core/avoid-conflicts-other-libraries/#use-an-immediately-invoked-function-expression

16
samy-delux

これらの特定の行はjQueryプラグインの通常のラッパーです。

「ドル記号を使用する可能性のある他のライブラリとプラグインが衝突しないように、jQueryをドル記号にマップする自己実行関数(クロージャ)に渡すことをお勧めします。実行の範囲内で他のライブラリによって上書きされることはありません。」

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

から http://docs.jquery.com/Plugins/Authoring

12
morgar

準備のためのマルチフレームワーク安全な速記は以下のとおりです。

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

これは、jQueryが$およびundefined変数を使用する唯一のフレームワークではないためです。

10
Timo Huovinen

もっと短い変形でも使うこと

$(()=>{

});

ここで$はjQueryを表し、()=>{}はクロージャからthisを継承する、いわゆる 'arrow function' です。 (thisでは、おそらくwindowの代わりにdocumentを持つことになります。)

0
Edvard Rejthar