SwitchModulePattern

JavaScript の global 空間に同じ名前のモジュールを複数回ロードしてしまうと、名前の取り合い(上書き)が発生し、大変困った事になります。 WebModule には、そのような名前空間の取り合いを回避し、モジュールを多重ロードする仕組み(SwitchModulePattern)があります。

以下のコードは、"MyExample" in GLOBAL が true なら alias = "MyExample_"; を行い、false なら alias = "MyExample"; を行っています。

(function moduleExporter(moduleName, moduleClosure) { // http://git.io/WebModule

    var alias  = moduleName in GLOBAL ? (moduleName + "_") : moduleName; // switch
    var entity = moduleClosure(GLOBAL);

    GLOBAL[alias] = entity;

})("MyExample", ...) {

});

SwitchModulePattern には、以下の使いどころがあります。

1. 後からロードしたモジュールが、既に動作しているモジュールを上書きせずにすみます

   • [A] 先に読み込んだモジュールは GLOBAL["MyExample"] = MyExample; としてロードします
   • [B] 後から同じモジュールは、GLOBAL["MyExample_"] = MyExample; としてロードします。先にロードしたモジュールの動作を阻害しません

   <script src="lib/MyExample.js"></script>  <!-- [A] -->
   <script src="lib/MyExample.js"></script>  <!-- [B] -->

2. Minifyしていないコードと、Minify後のコードをGLOBAL以下に共存させ同時にテストできます

   • [C] GLOBAL["MyExample"] に Minify前のモジュールをロードしテストします
   • [D] GLOBAL["MyExample_"] に Minify後のモジュールをロードしテストします

   <script src="lib/MyExample.js"></script>          <!-- [C] -->
   <script src="release/MyExample.min.js"></script>  <!-- [D] -->