［javascript］モジュール化&ネーミング汚染—fromプログラミングの改良

最近プログラムの精解の中のモジュール化を見て、啓発されました.
//******************/.
開発の実際のプロセスでは、ページまたは論理レイアウトに従って、jsコードは機能によっていくつかのブロックに分割できます.データインタラクション、フォーム検証、ページレイアウトなどのモジュールです.
開発効率と後期コードの維持を向上させるために、数十個のjs関数をモジュールに区分し、調整と後続の修正に有利である.しかし、数十の関数を書き出す時、ネーミングは自然に問題が発生します.他の関数名が思いつかない、あるいはいっそのこと、二つの関数の名前を変更しました.これは繰り返し声明によるバグをネーミング汚染といいます.これは大型プロジェクトでよく見られます.
モジュール開発といえば、最も容易に思いつくのは、jsファイルを通じてモジュールに分けてコードを格納し、呼び出しすることです.ファイルの保存の弊害は、例えばトップページに3、4つのjsファイルをロードして、異なるファイルの中の大域変数、関数と変数を含んで、どうやってネーミング衝突が存在しないことを保証しますか?コードモジュール化も同時に可能ですか?
　　
1.モジュールオブジェクトにより実現します.
本の中の例を挙げて、1ヶ月の翻訳機を作って、1月に訳します.初心者にとってはそうかもしれません.
　　　　　　 

var names = [' ',' ',' ',' ',' ',' ',' ',' ',' ',' ','  ','  '];

function getMonthName(num){

    return names[num-1]+' ';

};

function getMonthNum(str){

    for(var i in names){

        if( str == (names[i]+' ')){

            return i+1;

        }

    }

};

この中のnamensとgetMonthNameは、get MonthNumの生存域がトップクラスなので、他のファイルやjsコードからnamensという名前の変数が宣言されていると、プログラム異常が発生します.
バックグラウンドの管理サイトでは、フォームの検証、画像のマルチキャストコンポーネント、domロード、あるinputからデータを読んでjson、hover効果、ポップアップ層という機能が必要です.これらの機能やプラグインが直接にグローバル関数やグローバル変数を宣言したら、ネーミングしたいと思います.
　　
だからこの時、機能を利用して閉鎖して作用のドメインの名前の汚染を生むことを免れると思い付くべきで、上のコードの最も簡単な改正はそうです.
　　

//           

//names                  ，      

//         window         ，      

(function(){

    var names = [' ',' ',' ',' ',' ',' ',' ',' ',' ',' ','  ','  '];

    window.getMonthName = function getMonthName(num){

        return names[num-1]+' ';

    };

    window.getMonthNum = function getMonthNum(str){

        for(var i in names){

            if( str == (names[i]+' ')){

                return i+1;

            }

        }

    };

})();

この方法は良くないところもあります.私達はいつもすべての関数インターフェースをwindowオブジェクトの属性に結びつけることができません.それは直接コードの中で関数を宣言するのと同じです.
したがって、もう一歩最適化はモジュールオブジェクトとして簡単に最適化し、モジュールオブジェクトに関数を結びつけ、モジュールオブジェクトの属性にアクセスすることによって機能を呼び出すことです.
　　
　　

var monthTranslator = (function(){

    var names = [' ',' ',' ',' ',' ',' ',' ',' ',' ',' ','  ','  '];

    return {

        getMonthName:function(num){

            return names[num-1]+' ';

        },

        getMonthNum:function(str){

            for(var i in names){

                if( str == (names[i]+' ')){

                    return i+1;

                }

            }

        }

    };

})();

上の関数が呼び出された時は、そのままmontTranslator.get MonthName(1)を使います. いいです.もちろん、namesをモジュールの対象とする属性が現れることもできます.これは機能設計によるものです.
 
//***************//
これらはjsコードのモジュール化です.これは仁義にかなっています.ある人はあなたの書き方が何の役に立つと思いますか?
しかし、良いコードスタイルはプログラマーの優れた品性だと思います.人に対しても自分に対しても、素晴らしいです.
　　
最近はbraacketsが好きです.軽快でいいです.