0

私は現在、特定のページのすべての JavaScript 機能を JQuery のdocument.readyハンドラーに書いています。

$(document).ready(function() {
    var one, two, three;
    function f1(par1) {}
    function f2() {}
        ...
});

これは最適ではないか、Javascript のベスト プラクティスに従っていないと思います。私が必要としているのは、ページの機能のためのプライベートスコープです。外部から呼び出す必要はありません。

私はいくつかの異なる方法を見てきました：

jQuery ソース

(function(window) { 
    var anObj = {};
    ... 
    window.functionality = anObj;
}(window));

windowas パラメーターで自己呼び出しされfunctionality、アプリケーションのオブジェクトを設定する関数。

コードミラー ソース

window.functionality = (function() {
   var functionality = {};
   ...
   return functionality;
}());

jQuery が行うことと非常に似ていますがwindow、自己呼び出し関数が最初に何かを返すようにすることで、機能オブジェクトを間接的にオンに設定します。

この質問

var functionality = {};
(function(obj) { obj.f1 = ... }(functionality));

( on の代わりにwindow) ローカル変数を作成し、その内容を自己呼び出し関数内に設定する (なぜ?)

JavaScript で名前空間を宣言するにはどうすればよいですか?

var functionality = { 
    f1: function(){}, 
    f2: function(){}
}

先ほどとほぼ同じですが、自己呼び出し機能なしで内容を設定します（ここでも自己呼び出し機能を使用する理由と使用しない理由は何ですか？）。

では...どの方法が最適ですか？

4

1 に答える 1

2

これには、ページがモジュールとして扱われるモジュール パターンをお勧めします。Web 上には JavaScript モジュール パターンに関する多くの情報があります。http://www.adequatelygood.com/JavaScript-Module-Pattern-In-Depth.htmlをご覧ください。

リンクの例を使用して、少し変更しました。

var MyApp = MyApp || {};
MyApp.PageX = (function () {
    var my = {},
        privateVariable = 1;

    function privateMethod() {
        // ...
    }

    my.moduleProperty = 1;
    my.moduleMethod = function () {
        // ...
    };

    return my;
}());

ここで何が起こっているかというと、一連のプロパティとメソッドが定義され、名前空間がMyApp.PageXに付けMyAppられ、グローバルになります。したがって、これは機能します：

MyApp.PageX.moduleProperty; // 1
MyApp.PageX.moduleMethod();
于 2013-05-17T07:54:04.720 に答える