Analysis on the--javascript of modular loading learning of AMD CMD COMMONJS specification _javascript Skills

Source: Internet
Author: User

This is an article about JavaScript Modular AMD,CMD,COMMONJS Learning summary, as a record also to the three ways to have questions about children's shoes, there are errors or deviations, I hope that the great God pointed out, appreciate.

The default reader probably knows the use of Require,seajs (Amd,cmd usage), so no syntax is added.

1. Why is it born:

These three specifications are all made for JavaScript modular loading, are used or expected to use some of the modules to load the module, so that a large number of systems large and complex code to be well organized and managed. Modularity makes it less confusing to use and manage code, and facilitates collaboration among many people.


2. Those norms:

(1), COMMONJS is an organization that is interested in building JavaScript ecological circle. The entire community is committed to improving the portability and transferability of JavaScript programs, both on the server side and on the browser side.

A group with a goal of building up the JavaScript ecosystem to Web servers, desktop and command line apps and in the brow Ser.

A targeted build JavaScript Ecosystem Web server group, in browsers and command-line applications and desktops. (he says so on his own wiki)

This organization has developed some specifications (can go to their website to see http://www.commonjs.org/) including Commonjs modules/1.0 specification, we usually speak of COMMONJS specifications, said this.

"The Commonjs API would fill that gap by defining APIs that handle many common application needs, ultimately providing a St Andard Library as rich as those of Python, Ruby and Java. "--(originating from http://www.commonjs.org/)

So Commonjs is a more biased server-side specification. Node.js has adopted this specification. According to the COMMONJS specification, a separate file is a module. The load module uses the Require method, which reads a file and executes it, and finally returns the exports object inside the file.

He added that it could be used in the following scenarios, so he was more visibly biased toward the server side. Of course, you can also use it in the browser (they say they can).

server-side JavaScript Applications
Command line tools
Desktop gui-based Applications
Hybrid Applications (titanium, Adobe AIR)

(2), AMD specification

COMMONJS solves the problem of modularity, and can be used in the browser, but the COMMONJS is a synchronous loading module, when the module is used, is loaded now, this synchronization mechanism to the browser inside there is a problem, loading speed AH what (browser synchronization loading module will result in performance, availability, Issues such as debugging and Cross-domain access.

In view of the special situation of the browser, there is a specification, this specification can be implemented asynchronous load dependent module, and will be loaded in advance that is the AMD specification. AMD can be used as a relay version of the COMMONJS module as long as COMMONJS is not used to synchronize require calls. COMMONJS code that uses the synchronous require call can be converted to the AMD module loader using the callback style (https://github.com/amdjs/amdjs-api/wiki/amd-%e4%b8%ad%e6%96%87% e7%89%88) (as it says).


The following is a module definition using a simple COMMONJS conversion (it is a usage of the AMD specification):

Copy Code code as follows:

Define (function (Require, exports, module) {
var a = require (' a '),
b = require (' B ');

Exports.action = function () {};
});


So AMD and COMMONJS is compatible, as long as a slight change to call the method to achieve synchronous loading (I very doubt AMD is also in COMMONJS based on a shell, and then did not find other God horse description and support of the text, found must add to this).

Take a look at AMD specifications you will find that AMD is basically to explain the dependent modules in advance, and then preload these modules, in fact it requires you to think ahead of these dependencies, write well in advance, or write code in the process to go back to the beginning to add dependencies.

 
(3), CMD

Do not know is not aimed at this problem, Taobao Yuber Daniel made a seajs out, and claimed that the specification is in accordance with the CMD specification, and then gave a connection to this specification (open will find the words draft). What about this specification, Yuber, I know that.

"AMD is requirejs in the promotion process of the modular definition of the standardized output."

CMD is the normalized output of the module defined by SEAJS in the process of popularization.
Similar to the COMMONJS modules/2.0 specifications, is the BRAVOJS in the promotion process of the modular definition of the standardized output.
There are a lot of ...

So this specification is actually for the promotion of SEAJS and then get out. So look at the SEAJS is how to do it, the basic is to know this specification.

Also SEAJS is preload dependent JS and AMD specifications are the same on preload, obviously different places are calls, and declaration dependencies. Both AMD and CMD use Difine and require, however, the CMD standard tends to be used in the process of making dependencies, that is, no matter where the code to suddenly find that need to rely on another module, then in the current code with require introduced on it, the specification will help you to fix preload, you can write casually. But the AMD standard lets you have to write well in advance in the head Dependency parameter section (not written?). Go back and write it down. This is the most obvious difference.


3. Symbiotic Coexistence

Since COMMONJS is a server-side specification, a further two standards do not actually conflict.

AMD used more abroad, of course, domestic also a lot of jquery1,7 version began to use, dojo in the 1.6 version began to use, which has been able to prove that it is enough cow X.

CMD Of course also have a lot of people in use, but basically are concentrated in the domestic, SEAJS official website to show a lot of the company in use (including Archie Art, Tencent Weibo, Alipay, Taobao and so on a lot, to see the http://seajs.org/docs/), estimated small unknown also countless , after all, a lot of company recruitment request will be seajs well.

So three specifications are very good now (in fact, mainly because JS does not have their own module loading mechanism, ES6 out after do not know how).

What happens when we write a file that needs to be compatible with different loading specifications, and look at the code below.

(function (root, factory) { 
 
  if (typeof define = = ' function ' && define.amd) { 
 
    //AMD 
 
    define ([' jquery ' , ' underscore '], factory); 
 
  else if (typeof exports = = = ' object ') { 
 
    //Node, commonjs such 
 
    module.exports = Factory (' jquery '), Require ( ' underscore '); 
 
  } else { 
 
    //Browser global variable (root is window) 
 
    Root.returnexports = Factory (Root.jquery, root._); 
 
  } 
 
(This, function ($, _) { 
 
  //method 
 
  function A () {};//Private method, as it is not returned (see below) 
 
  function B () {};//public method, as it was returned to the 
 
  Fu Nction C () {}; Public method, since it was returned 
 
    
 
  //Exposed public method return 
 
  { 
 
    b:b, 
 
    c:c 
 
  } 
 
});

This code can be compatible with a variety of loading specifications.


4, AMD and CMD difference

The following points are Yuber in the knowledge.

1. For dependent modules, AMD is ahead of schedule, CMD is delayed execution. However, Requirejs from 2.0, also changed to be able to delay the execution (different according to the writing, processing different). CMD advocates as lazy as possible.
2. CMD is highly reliant on proximity, AMD is highly reliant on the front end.

3. AMD's API default is one when multiple uses, CMD's API strictly distinguishes, the promotion responsibility is unitary. For example, AMD, require divided into global require and local require, are called require. CMD, there is no global require, but according to the completeness of the module system, provide seajs.use to achieve the load start of the module system. In CMD, each API is simple and pure.

4. There are also some details of the differences, the specific definition of this specification is good, do not say more.
(OK ~ 4th is not much to say ...) )


5, AMD and cmd some of the same

have both difine and require, and the invocation method can actually add dependency parameters, that is, you can implement a preload dependency module in a way that provides dependency parameters (but not recommended because note: The Define usage of the ID and Deps parameters is not part of the CMD specification but belongs to the module S/transport specifications. ---from: https://github.com/seajs/seajs/issues/242).

AMD can also use require to load the modules used in factory, but this module will not be preloaded, which is loaded synchronously.

var a = require (' a '); Load Module A

There are some irregularities, welcome treatise.

The above analysis of AMD CMD COMMONJS specification--javascript Modular Loading Learning Summary is a small series to share all the content, hope to give you a reference, but also hope that we support the cloud-dwelling community.

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.