RequireJS-AMDモジュール

RequireJSのモジュールはスコープオブジェクトであり、グローバル名前空間では使用できません。したがって、グローバル名前空間は汚染されません。RequireJS構文を使用すると、依存関係の順序を追跡する必要がなく、モジュールをより高速にロードできます。同じページに同じモジュールの複数のバージョンをロードできます。

モジュールの定義

モジュールは、を使用して定義されます define()関数; 同じ関数がモジュールのロードにも使用されます。

単純な名前と値のペア

モジュールが名前と値のペアの単なるコレクションである場合は、次の構文を使用できます-

define({
   state: "karnataka",
   city: "bangalore"
});

関数の定義

モジュールは、依存関係がなくても、フレームワークの関数を使用できます。これは、次の構文を使用して実行できます-

define(function () {
   
   //Do setup work here
   return {
      state: "karnataka",
      city: "bangalore"
   }
});

依存関係のある関数の定義

モジュールに依存関係がある場合、最初の引数（依存関係名の配列）、2番目の引数（関数の定義）、およびモジュールを定義する戻りオブジェクトの配置は、次の構文で示されます。

define(["./mnc", "./startup"], 
   function(mnc, startup) {
        
      return {
         state: "karnataka",
         city: "bangalore",
      
         addCompany: function() {
            mnc.decrement(this);
            startup.add(this);
         }
      
      }
   }
);

モジュールを関数として定義する

モジュールがオブジェクトのみを返すことは必須ではありません。関数からの有効な値も返すことができます。次の構文は、モジュールを関数として定義するために使用されます-

define(["./mnc", "./startup"],
   function(mnc, startup) {
       
      return function(title) {
         return title ? (window.title = title) :
         startup.storeName + ' ' + mnc.name;
      }
      
   }
);

名前を使用したモジュールの定義

場合によっては、最初の引数としてモジュールの名前を含める必要があります。 define()。これは、次の構文を使用して実行できます-

define("js2/title",
   ["js1/mnc", "js1/startup"],
   
   function(mnc, startup) {
      //Define js2/title object in here.
   }
   
);

モジュールのロード