-
Notifications
You must be signed in to change notification settings - Fork 8
WebModulePattern
uupaa edited this page Aug 1, 2015
·
69 revisions
このエントリでは、WebModule に使われている 実装パターン(WebModulePattern) について紹介しています。
WebModulePattern は、どこでも動作し見通しの良いモジュールを記述するためのコードパターンです。 以下のように記述すると、Browser, Node.js, Worker, NW.js で動作するモジュールを構築できます。
WebModule における GLOBAL とは JavaScript のルート要素(window や self, global)を示す定数です。この値は WebModuleIdiom を使って導き出されます。
WebModulePattern を使って定義したモジュールは GLOBAL 直下ではなく、GLOBAL.WebModule 名前空間の下に export されます。
以下は、モジュールを定義する部分のコードを抜粋したものです。
function MyExample() { ... } が GLOBAL.WebModule.MyExample として export されます。
(function moduleExporter(name, closure) {
"use strict";
var entity = GLOBAL["WebModule"]["exports"](name, closure);
// Node.js 用に export
if (typeof module !== "undefined") {
module["exports"] = entity;
}
// entity の 初期化処理
//
return entity;
})("MyExample", function moduleClosure(global) {
"use strict";
function MyExample() { ... }
return MyExample; // return entity
});GLOBAL を導き出すコード や GLOBAL.WebModule.exports 関数などの共通コードは、WebModule.js に記述し、MyExample.js より先にロードしておきます。
また、古いスタイルで書かれたコードを WebModulePattern に書き直す方法 についても参照してください。
TBD: このセクションは推敲や検証が終わっていません。
WebModulePattern で書かれたコードを ES6::Modules の export に対応させるには先頭に1行追加します。
export // この行を追加
(function moduleExporter(name, closure) {
"use strict";
:
return entity;
})("MyExample", function moduleClosure(global) {
function MyExample() { ... }
return MyExample; // return entity
});