javaScript模块化规范ADM与CMD

模块化：模块化是指在解决某一个复杂问题时，依照一种分类的思维把问题进行系统性的分解处理，可以想象一个巨大的系统代码，被整合优化分割成逻辑性很强的模块时，对于软件是一种何等意义的存在。

模块化系统所必须的能力：

1、定义封装的模块

2、定义新模块对其他模块的依赖

3、可对其他模块的引入支持

AMD模块规范：其实就是异步模块定义，所有的模块将被异步加载，模块加载不影响后面语句运行，所有依赖某些模块的语句均放置在回调函数中。

AMD规范定义了一个全局变量define函数，格式为：define(id, dependencies, factory)

第一个参数：id为字符串类型，表示模块标识，为可选参数，如果忽略这个参数，则模块标识默认为加载器中被请求的文件的URL为模块标识。如果需要填写这个id，则最好是加载器中该模块的URL(填写id一般是为了合并多个模块减少网站中HTTP请求)。

第二个参数：dependencies是一个数组，为可选参数，里面存放着当前模块所依赖的其他模块标识.

第三个参数：factory是一个函数或者对象

案例：创建模块

define('./bsSave', ['./ajax', './lib/domApi'], function (ajax, domApi){

　　var remArr = [];

　　//模块代码

　　return remArr;

})

//无依赖模块可以直接使用对象字面量来定义

define({

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

　　age: 25,

　　name: 'luke'

})

CMD模块规范：在CMD中，一个模块就是一个文件。全局函数define，用来定义一个模块。格式为：define(id, dependencies, factory);

第一个参数：id为字符串类型，表示模块标识，为可选参数，如果忽略这个参数，则模块标识默认为加载器中被请求的文件的URL为模块标识。如果需要填写这个id，则最好是加载器中该模块的URL(填写id一般是为了合并多个模块减少网站中HTTP请求)。

第二个参数：dependencies是一个数组，为可选参数，里面存放着当前模块所依赖的其他模块标识。

第三个参数：factory可以是一个函数，也可以为对象或者字符串。当factory为对象或者字符串时，表示模块的接口就是该对象或者字符串。

案例：定义一个模块

define('./BsSave', ['./ajax'], function (require, exports, module){

　　var BsSave = {};

　　//模块代码

　　return BsSave；

})

//定义JSON数据模块

define({"name": "csh"})

//通过字符串定义模板模块

define('this is {{data}}');

//factory为函数的时候，表示模块的构造方法，通过return可以输出该模块的数据

define(function (){

　　var modArr = [];

　　//模块代码

　　return modArr; //输出该模块的数据

})

当模块的第三个参数是函数的时候，这个函数也有三个参数，分别是require、exports、module

require：是一个方法，接受模块标识作为唯一的参数，用来引入其他模块，require方法是同步往下执行的，需要异步加载模块可以使用require.async方法，可以使用require.resolve方法来返回模块路径

案例：加载模块

define(function(require, exports, module){

　　//同步加载模块

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

　　//异步加载模块

　　require.async('./ajax', function (ajax){

　　　　ajax.get();

　　})

　　//返回模块的路径，但它不会加载模块

　　require.resolve('./ajax');

})

exports：用来向外提供模块接口，当然直接使用return也是可以的

案例：为模块向外提供接口

define(function(require, exports, module){

　　exports.name = 'csh';          //向外提供的属性

　　exports.do = function (){};     //向外提供的方法

　　//这样也可以向外提供接口

　　return {

　　　　name: 'csh',

　　　　do: function (){}

　　}

　　//这样也可以向外提供接口

　　module.exports = {

　　　　name: 'csh',

　　　　do: function (){}

　　}

　　//注意，以下方式是错误的

　　exports = {

　　　　name: 'csh',

　　　　do: function (){}

　　}

})

module：为一个对象，上面存储了一些与当前模块相关联的属性与方法

module.id：为模块的唯一标识。

module.uri：根据模块系统的路径解析规则得到模块的绝对路径。

module.dependencies：表示模块的依赖。

module.exports：当前模块对外提供的接口。

下面是玉伯对于 AMD 与 CMD 区别的解释(详细的区别可对照上文)：

AMD 是 RequireJS 在推广过程中对模块定义的规范化产出。

CMD 是 SeaJS 在推广过程中对模块定义的规范化产出。

类似的还有 CommonJS Modules/2.0 规范，是 BravoJS 在推广过程中对模块定义的规范化产出还有不少

这些规范的目的都是为了 JavaScript 的模块化开发，特别是在浏览器端的。

目前这些规范的实现都能达成浏览器端模块化开发的目的。

扩展阅读：

AMD规范文档 https://github.com/amdjs/amdjs-api/wiki/AMD

RequireJS官网接口文档  http://www.requirejs.org/docs/api.html

CMD 模块定义规范 https://github.com/seajs/seajs/issues/242

SeaJS API快速参考 https://github.com/seajs/seajs/issues/266

知乎  AMD 和 CMD 的区别有哪些？ http://www.zhihu.com/question/20351507