JavaScript Modular specification ADM and cmd introduction

Source: Internet
Author: User

Modularity: modularity means that in solving a complex problem, according to a classification of the thinking of the problem of systematic decomposition, you can imagine a huge system code, is integrated into the optimization of the division into a very strong logic module, the software is a kind of how meaningful existence.

Capabilities required for Modular systems:

1, define the module of encapsulation

2 . Define the dependencies of the new modules on other modules

3, can support the introduction of other modules

AMD Module Specification: in fact, is the asynchronous module definition, all modules will be loaded asynchronously, the module load does not affect the subsequent statements run, all dependent on some of the module statements are placed in the callback function.

The AMD specification defines a global variable define function in the format:define (ID, dependencies, Factory)

The first parameter:ID is a string type that represents the module identity, an optional parameter, and if this parameter is omitted, the module identity defaults to the URL of the requested file in the loader as the module identity. If you need to fill in this ID, it is better to be the URL of the module in the loader ( fill in the ID is usually to merge multiple modules to reduce the site HTTP Request ).

The second parameter:dependencies is an array, an optional parameter that holds the other module identifiers that the current module depends on .

Third parameter:factory is a function or object

Case: Creating a Module

Define ('./bssave ', ['./ajax ', './lib/domapi '], function (Ajax, DOMAPI) {

var remarr = [];

  Module code

return Remarr;

})

no-dependency modules can be defined directly using object literals

Define ({

Add:function (x, y) {return x + y;},

AGE:25,

Name: ' Luke '

})

Cmd module specification: in cmd Span style= "font-family: the song Body;" > A module is a file. Global functions define , used to define a module. The format is: define (id, dependencies, factory);

The first parameter:ID is a string type that represents the module identity, an optional parameter, and if this parameter is omitted, the module identity defaults to the URL of the requested file in the loader as the module identity. If you need to fill in this ID, it is better to be the URL of the module in the loader ( fill in the ID is usually to merge multiple modules to reduce the site HTTP Request ).

The second parameter:dependencies is an array, an optional parameter that holds the other module identifiers that the current module depends on.

The third argument:factory can be a function or an object or a string. when factory is an object or a string, the interface that represents the module is the object or string.

Case: Defining a Module

Define ('./bssave ', ['./ajax '], function (require, exports, module) {

var bssave = {};

Module Code

return Bssave;

})

defining JSON data Modules

Define ({"Name": "CSH"})

defining template Modules by string

Define (' This is {{data}} ');

when factory is a function, it represents the construction method of the module, and the data of the module can be output by return .

Define (function () {

var modarr = [];

  Module Code

return Modarr; // output data for this module

})

When the third parameter of a module is a function, the function also has three parameters, namely require,exports,module

Require: is a method that accepts the module identifier as the only parameter used to introduce other modules, therequire method is executed synchronously, which requires the asynchronous loading module to use Require.async method, you can use the require.resolve method to return the module path

Case: Loading Modules

Define (function (Require, exports, module) {

Synchronous Loading Module

var ajax = require ('./ajax ');

Asynchronous Load Module

Require.async ('./ajax ', function (Ajax) {

Ajax.get ();

})

returns the path to the module, but it does not load the module

Require.resolve ('./ajax ');

})

Exports: used to provide a module interface to the outside, of course, the direct use of return is also possible

Case: Providing an interface to the module outward

Define (function (Require, exports, module) {

Exports.name = ' csh '; // out-of-the-supply properties

Exports.do = function () {}; // outward-available methods

This can also provide an interface to the outside

return {

Name: ' CSH ',

Do:function () {}

}

This can also provide an interface to the outside

Module.exports = {

Name: ' CSH ',

Do:function () {}

}

Note that the following methods are incorrect

Exports = {

Name: ' CSH ',

Do:function () {}

}

})

Module: for an object that stores some properties and methods associated with the current module

Module.id: Unique identification for the module.

Module.uri: The absolute path of the module is obtained according to the path parsing rules of the module system.

Module.dependencies: represents the dependency of the module.

Module.exports: interface provided externally by the current module.

Here is Yuber's explanation of the difference between AMD and CMD ( The detailed differences can be compared to the above ):

AMD is the normalized output of the module defined by REQUIREJS during the promotion process.

CMD is the normalized output of the module defined by SEAJS in the process of generalization.

Similar to the CommonJS modules/2.0 specification, is bravojs in the promotion process of the module definition of standardized output and a lot of

These specifications are intended for the modular development of JavaScript , especially on the browser side.

At present, the implementation of these specifications can achieve the purpose of browser-side modular development.

Extended reading:

AMD Specification document Https://github.com/amdjs/amdjs-api/wiki/AMD

REQUIREJS official Website Interface document http://www.requirejs.org/docs/api.html

CMD Module Definition Specification https://github.com/seajs/seajs/issues/242

SEAJS API Quick Reference https://github.com/seajs/seajs/issues/266

What are the differences between AMD and CMD? http://www.zhihu.com/question/20351507

JavaScript Modular specification ADM and cmd introduction

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.