JavaScript Modular Thinking Commonjs, AMD, CMD, UMD

The previous article learned what a module is, this article briefly describes how to define and load a module.

I know three kinds of module loading methods are Commonjs, AMD and CMD online about these three kinds of module loading mode of the article a lot, I would like to do a brief introduction, if you want to know more about the internet to look at the relevant information. (1) Commonjs in Commonjs, a single file is a module. The called module uses the exports exposed interface, and the calling module uses require to invoke the exposed interface. Examples are as follows:

 1  //  Student.js  2  //  private variable  3  var  a = 123 4  function   Add (Student) { 5  console.log (' Add student: ' +  student);  6  }  7  //  Exports the methods and variables on the object are externally accessible  8  exports.add = add; 

1 // loading student.js modules with require 2 var student = require ('./student.js ');

The COMMONJS load module is "synchronous", that is, if we want to invoke the public methods and variables in the called module, be sure to wait until the called module is loaded. The Nodejs used for the service side uses the COMMONJS to manage the module. However, in the browser side, the synchronization load will be due to the impact of receiving network environment there is a great uncertainty, so commonjs is not suitable for the browser side.

If you want to load a module from a server in a browser environment, you must use the "async" approach. So there's the AMD and CMD solution.

(2) AMD (Asynchromous module Definition) Requirejs is a management plug-in that uses the AMD asynchronous load module. AMD modules support Objects, functions, constructors, strings, JSON, and various types of modules. The AMD specification uses the Define method to define the module:

1 //define (PARAM1,PARAM2) defining modules by define method2 //@param1: Array, element for the imported dependency module3 //@param2: callback function, passing through a parameter to a dependency4define ([' Firstmodule ', ' secondmodule '),function(firstmodule,secondmodule) {5      functionfoo () {6 firstmodule.test ();7      }8      //exposed foo ()9      return{Foo:foo};Ten});

At the same time, AMD allows the use of the Define method to define modules that are compatible with the COMMONJS specification, using require and exports.

1 define (function(require,exports,module) {2      var reqmodule = Require ("./firstmodule"); 3      reqmodule.test (); 4 5      function () {6             // function Body 7      }8 });

(3) The difference between Cmdcmd and AMD is mainly reflected in the timing of the implementation of the dependent modules, AMD is "relying on the front." Advocate loading the required modules ahead of time, and CMD is "dependent on the nearest". That is, it can be used to load again. A bit like "a Hungry Man mode" and "lazy Mode" in Java. Starting with Requirejs 2.0, you can also delay loading. Give me a chestnut:

1 //amd---dependent front-facing2define (['./a ', './b '),function(A, b) {3     //declaring the module to be relied on in advance4 });5 6 //CMD7Definefunction(require,exports,module) {8     //Reliance can be written near9     varA = require ('./a '));Ten a.test (); One  A     //Soft Dependency -     if(status) { -         varb = require ('./b ')); the b.test (); -     } -});

Here is a term called soft dependency, I personally understand that soft dependency is not necessarily dependent, hard-to-rely on the module will depend on, soft dependence is required to rely on, do not need to rely on the status of Judgment.

(4) Umdumd--universal module definition, the common modules defined UMD equals COMMONJS plus AMD.    UMD's job is to make a judgment:-first to determine whether the current environment to NODEJS support for the existence of the module exists in the node. JS Module mode (exports). -If not supported, determine if AMD (define) is supported, and the presence is loaded using AMD mode. Feel oneself to UMD still not very understanding, do not know how to use specifically. or continue to understand. Come on!

JavaScript Modular Thinking Commonjs, AMD, CMD, UMD