1、模块化
为什么要使用模块化
Javascript在发展初期就是为了实现简单的页面交互逻辑，故简单的引入几个脚本即可满足需求；如今CPU、浏览器性能得到了极大的提升，很多页面逻辑迁移到了客户端（表单验证等），随着web2.0时代的到来，Ajax技术得到广泛应用，jQuery等各种前端库层出不穷，前端代码日益膨胀；
这时候的JavaScript作为嵌入式脚本语言的定位动摇了，JavaScript没有为组织代码提供任何明显帮助，甚至没有类 or package的概念，更不用说模块（module）了，JavaScript极其简单的代码组织规范不足以驾驭如此庞大规模的代码了。模块化的作用：
主要目的：解决命名冲突、依赖管理
其他目的：提高代码可读性、代码解耦（提高复用性）
2、CMD、AMD、CommonJS 规范分别指什么？有哪些应用?
**CommonJS : **
CommonJS主要是针对服务端的一个模块化规范，是NodeJS中的规范标准
- 1、定义模块 根据CommonJS规范，一个单独的文件就是一个模块。每一个模块都是一个单独的作用域，也就是说，在该模块内部定义的变量，无法被其他模块读取，除非定义为global对象的属性.
- 2、模块输出： 模块只有一个出口，CommonJS规范中定义了一个module.exports对象，我们需要把模块希望输出的内容放入该对象
- 3、加载模块： 加载模块使用require方法，该方法读取一个文件并执行，返回文件内部的module.exports对象
demo 一个简单的例子
//模块定义 myModel.js
var name = 'my'
function printName() {
console.log(name)
}
function printFullName(firstName) {
console.log(firstName + name)
}
//模块输出
modules.exports = {
printName : printName,
printFullName : printFullName
}
//加载模块
var nameModule = require('myModel.js');
nameModule.printName();
AMD:
AMD(Asynchronous Module Definition),即异步模块定义，这是一个在浏览器端模块化开发的规范
由于不是JavaScript原生支持，使用AMD规范进行页面开发需要用到对应的库函数，也就是被广泛运用的RequireJS，实际上AMD 是 RequireJS 在推广过程中对模块定义的规范化的产出
RequireJS 主要解决了两个问题
- 1、多个js文件可能有依赖关系，被依赖的文件需要早于依赖它的文件加载到浏览器
- 2、js加载的时候浏览器会停止页面渲染，加载文件越多，页面失去响应时间越长
demo:一个requireJS的例子
定义模块myModule.js
define(['myModule'],function() {
var name = 'my'
function printName(){
console.log(name);
}
return {
printName: printName
};
})
//加载模块
require(['myModule'],function(my) {
my.printName()
})
语法分析
requireJS定义了一个函数 define，它是全局变量，用来定义模块
define(id?, dependencies?, factory)
- 1、id：可选参数，用来定义模块的标识，如果没有提供该参数，脚本文件名（去掉拓展名）
- 2、dependencies：是一个当前模块依赖的模块名称数组
- 3、factory：工厂方法，模块初始化要执行的函数或对象。如果为函数，它应该只被执行一次。如果是对象，此对象应该为模块的输出值
加载模块
require([dependencies], function(){});
CMD
CMD 即Common Module Definition通用模块定义，CMD规范是国内发展出来的，就像AMD有个requireJS，CMD有个浏览器的实现SeaJS，SeaJS要解决的问题和requireJS一样，只不过在模块定义方式和模块加载（可以说运行、解析）时机上有所不同
语法
定义模块
define(id?, deps?, factory)
- 一个文件一个模块，所以经常就用文件名作为模块id
- CMD推崇依赖就近，所以一般不在define的参数中写依赖，在factory中有三个参数
function(require, exports, module)
1、require 是一个方法，接受 模块标识 作为唯一参数，用来获取其他模块提供的接口
2、exports 是一个对象，用来向外提供模块接口
3、module 是一个对象，上面存储了与当前模块相关联的一些属性和方法
demo
// 定义模块 myModule.js
define(function(require, exports, module) {
var $ = require('jquery.js')
$('div').addClass('active');
});
// 加载模块
seajs.use(['myModule.js'], function(my){
});
