#モジュラー開発の概要
————現時点で最も重要なフロントエンド開発モデル
-開発効率を向上させる
-開発コストを削減します
#モジュール性の進化
-Stage1ファイル分割方式
モジュールとして必要な変数とメソッドを格納するモジュールとしてファイルを設定します
短所:グローバル参照、グローバルスコープの汚染
モジュール内のメンバーは、モジュール外で呼び出して変更できます
初期のモジュール性は完全に慣習に依存していました
-stage2名前空間メソッド
最初の段階に基づいて、各モジュールをグローバルオブジェクトにラップする方法
短所:モジュールメンバーは引き続き外部から呼び出して変更できます
-stage3 IIFE(即時実行関数)
モジュールにプライベートスペースを提供し、ブロックを関数に配置し、グローバルに公開する必要のある変数とメソッドをマウントします
利点:プライベートメンバーを実現する
#モジュラー仕様の出現
## CommonJS仕様(Node.js)
-ファイルはモジュールです
-各モジュールには個別のスコープがあります
-module.exportsを介してメンバーをエクスポートします
-require関数を介してモジュールをロードします
CommonJSはモジュールを同期モードでロードします
ブラウザを直接使用してCommonJSを使用する場合、読み込み時間が長すぎて効率が遅くなります。
## AMD(非同期モジュール定義)
————非同期モジュール仕様(Require.js)
-定義
define( 'moduleName'、['jquery'、 '。/ moduleOther']、function(\ $、moduleOther){
戻り値{
start:function(){
console.log( 'これは私のモジュール性です');
}
}
});
-読み込み中
require(['./ moduleName']、function(moduleName){
moduleName.start()
})
AMDの使用は比較的複雑であり、モジュールJSファイルが頻繁に要求されます。
## Ses.js + CMD Taobaoのモジュラーライブラリ(CommonJs仕様と同様)
#モジュラー標準仕様
————モジュール化の最良の実現
Node.jsのCommonJS
ブラウザーのESモジュール