1

私は、JS のすべてにグローバルに使用される典型的な Web 開発者です。光が見えてきたので、名前空間に変換したいと考えています。したがって、現在のプロジェクトでは、呼び出されたときにテキストをアンカーに割り当て、クリックメソッドをアタッチして特定の div の表示を切り替える 3 つの JS 関数 (現在はすべてグローバル) を持つページがあります。非常に標準的です。

したがって、関数の例は次のように記述されます。

function toggleComments(){
   $("comments-section").hide();
   $("comments-button").click(function (){
      blah
      return false;
   });
}

私の質問は、これらの関数を保持する名前空間を作成してから呼び出すにはどうすればよいですか?

さまざまな例を見つけましたが、決定的なものはありません。

どんな助けでも素晴らしいでしょう。

4

2 に答える 2

2
// choos a namespace name that will not conflict with existing global variables
var myNS = {
        toggleComments: function(){
            $("comments-section").hide();
            $("comments-button").click(function (){
                // blah
                return false;
            });
        },
        anotherFunc: function(){
            return "something";
        }
}

// called like this
myNS.toggleComments();
alert( myNS.anotherFunc() );

さらに、匿名の自己呼び出し関数にコードを含めるようにしてください。これは、グローバル名前空間に何も持つことができないため、汚染のリスクがないことを意味します。

// other peoples/modules code
var myVariable = "whatever";

// anonymous function for your self contained code
(function(){
var myVariable = "inside anonymous function";
alert(myVariable);
})() // the empty brackets envoke the anonymous function

// still retains value from before your self envoking anonymous function
alert(myVariable);
于 2011-08-12T10:27:26.693 に答える
1

ビリームーンは良いスタートを示していますが、オブジェクトリテラルを使用する際の問題は、他のフィールド/関数/プロパティを相互参照できないことです。

私は明らかにモジュールパターンを好みます(http://www.wait-till-i.com/2007/08/22/again-with-the-module-pattern-reveal-something-to-the-world/を参照)

明らかにするモジュールパターンは、自己実行機能、クロージャーの(一種の)活用を組み合わせて内部プライベート関数/フィールドを提供し、params を渡して名前空間付きオブジェクトを初期化できるようにします。

var namespacedObject = function(param) {

    var settings = param || someDefaultSetting, //default if no param supplied
        somePrivateField = "someValue",
        somePublicField = "i'm public";

    //define some method we will later make public
    function toggleComments(){
        $("comments-section").hide();
        $("comments-button").click(function (){
             $(this).value= somePrivateField;
             return false;
        });
    }

    //this is where the magic happens, 
    //return object with all public fields/functions
    return { 
        toggleComments : toggleComments,
        somePublicField : somePublicField
    };

}(someParam);

名前空間付きのオブジェクトには、somePrivateField公開されているメソッドから参照できるプライベート フィールドが含まれていることがわかります。また、パブリックフィールドを公開し、関数などで使用/参照できるいくつかのパラメーターを受け入れたことに注意してください (何も渡されない場合は、デフォルトにデフォルト設定できます.

次のように使用できます。

namespacedObject.toggleComments();
alert(namespacedObject.somePublicField);
alert(namespacedObject.somePrivateField); //undefined - it's private of course!

私がこれを気に入っている理由の 1 つは、自己実行関数から返されたオブジェクト リテラルをちらりと見るだけで、何がパブリックかプライベートかを簡単に確認できることです。

お役に立てば幸いです

于 2011-08-12T11:11:10.150 に答える