2

私はすでにJavaScriptをカプセル化しています

jQuery(document).ready(function($) {

});

次の 2 つの方法で内部で関数を呼び出すことの意味を知りたいと思っていました。

jQuery(document).ready(function($) {
    $(function () {
        // do something
    });
});

対

jQuery(document).ready(function($) {
    (function () {
        // do something
    })();
});

編集：

また、どちらがより「正しい」やり方なのか知りたいと思いましたか? 独自の実装を自由に追加してください。

4

5 に答える 5

4

違いは、実行の順序にあります。

jQuery(document).ready(function($) {
    $(function () {
        // inner handler
    });
    // outer handler
});

内側のreadyハンドラー内のコードは、外側のハンドラー ( http://jsfiddle.net/nmD8b/ ) のコードの後に​​実行されます。

jQuery(document).ready(function($) {
    (function () {
        // do something
    })();
    // outer handler
});

即時関数式内のコードは、関数が定義されている場所、つまり式に続くコードの前に実行されます: http://jsfiddle.net/nmD8b/。

変数のスコープを設定する場合は、2 番目の方法を使用します。最初の方法はあまり意味がありませんready。実際に必要な場合にのみイベント ハンドラーを登録する必要があります。この場合、ハンドラーを別の準備完了ハンドラー内にバインドするため、DOM は既に準備ができています。

変数のスコープを設定したくない場合は、どちらも使用しないでください。すべてのコードを外側のハンドラー内に配置するだけです。

于 2012-11-01T18:29:08.103 に答える
1

誰もが述べているように：

jQuery(document).ready(function ($) { });

// is the document.ready as:

jQuery(function ($) { }); // <-- this is the short-hand version

// the $ inside the parenthesis really just means that $ is to refer to jQuery inside.
// you could just do:

$(function () { }); // if you know it will be anyway

通常のJavascriptで「クラス」/「名前空間」などを作成するには、即時関数を使用する方が適しています。

(function (myNamespace) {

    function myNamespace () { }
    return myNamespace;

}(window.myNamespace = window.myNamespace || {}));
于 2012-11-01T18:32:12.750 に答える
1
  • $(function () {});ドキュメントの準備ができたらいつでも使用しても安全です。指定された関数はすぐに起動します。見積もり:

DOM が初期化された後に .ready() が呼び出されると、渡された新しいハンドラーがすぐに実行されます。

注: Felix が指摘したように、jQuery は のネストされた呼び出しを防止しているようです.ready()。

  • (function () {})()ドキュメント準備完了イベントの内部または外部で使用されているかどうかに関係なく、使用は期待どおりに機能します。(i) クロージャを作成します (ii) すぐに起動します (iii) ドキュメントの準備ができているかどうかは気にしません。

最初のものは冗長であるため、IMO では 2 番目の方が優れています。

実際、クロージャーが必要ない場合は、関数をインラインにします。$(function () {});それ自体でクロージャーとして機能します。

于 2012-11-01T18:33:09.590 に答える
1 
jQuery(document).ready(function($) {

&&

$(function () {

同じことですか

2番目のものはjQuery 1.0+でのみ機能することを除いて（間違っていれば誰かが正しいと思います）

さらに

theは、名前空間$の簡略記号です。jQueryしたがってjQuery(、 と同じ$(です。$(document)次に、 which は と同じになるように記述できますjQuery(document)。ここで、 the$は名前空間の短縮形で、()フィードは指定されたパラメータです。この場合、documentこれは javascript と同じです。

$(functionは jQuery の doc.ready 呼び出し関数であり、通常の戻り値は、一般にjQuery Object. インデックス 0 は渡された要素であり、それ以外はすべて、その要素で返されるネイティブ js か、jquery の小道具とメソッドのいずれかです。

于 2012-11-01T18:27:10.747 に答える
0

$(function() {})それが のエイリアスであることを考えると$.ready、あなたの最初の例は単純に a$.ready内にラップされて$.readyいます。これは、パフォーマンスに深刻な影響があるとは思わないとしても、実際には意味がありません。

2 番目の例は、グローバル変数スコープの汚染を防ぐために、JavaScript ファイルの最も外側の部分で通常行うことです。

;(function($) {
    $(document).ready(function() {
        // Do something
    });
})(jQuery);

これは、これまでほとんどの JavaScript ファイルで見られたものです。グローバル変数のスコープの汚染を防ぎ、モードでも$実際に参照されるようにします。jQuerynoConflict

注意すべき重要な点$.readyは、終了タグの直前に JavaScript をロードする場合は、実際には必要ないということです</body>(そうすると、ページのロード時間も短縮されます)。

于 2012-11-01T18:26:33.267 に答える