1.恼人的命名冲突;前端
2.繁琐的文件依赖;正则表达式
1.解决命名冲突和依赖管理;数组
2.模块的版本管理;浏览器
3.提升代码的可维护性;性能优化
4.前端性能优化;网络
JavaScript自己不具有模块化的功能,开发人员为了更好的开发,须要人为的制定一套规范标准,约定一套固定的写法来实现JavaScript模块化功能。框架
一个模块化系统所必须的能力:异步
AMD(Asynchronous Module Definition)异步模块定义: 是 RequireJS 在推广过程当中对模块定义的规范化产出。前端性能
requireJS主要解决两个问题模块化
requireJS定义了一个函数 define,它是全局变量,用来定义模块
define(id?, dependencies?, factory);
在页面上使用require函数加载模块
require([dependencies], function(){});
require()函数接受两个参数
require()函数在加载依赖的函数的时候是异步加载的,这样浏览器不会失去响应,它指定的回调函数,只有前面的模块都加载成功后,才会运行,解决了依赖性的问题。
CMD(Common Module Definition)通用模块定义: 是SeaJS 在推广过程当中对模块定义的规范化产出。
Sea.js 推崇一个模块一个文件,遵循统一的写法。Sea.js定义了一个函数define,它是全局变量,用来定义模块
define(id?, deps?, factory)
由于CMD推崇一个文件一个模块,因此常常就用文件名做为模块id。CMD推崇依赖就近,因此通常不在define的参数中写依赖,在factory函数中写,factory函数有三个参数:require, exports, module。
function(require, exports, module)
require(id)----require 是一个方法,接受 模块标识 做为惟一参数,用来获取其余模块提供的接口
exports 是一个对象,用来向外提供模块接口
module 是一个对象,上面存储了与当前模块相关联的一些属性和方法
AMD和CMD最大的区别在于执行的时机不一样,注意不是加载的时机。对于依赖的模块,AMD 是提早执行,CMD 是延迟执行。
AMD,CMD在模块的加载方面是没有差别的,都是异步加载,而且顺序不可控,在factory执行时,其依赖模块都已被加载。
在上述代码中,AMD中在BEGIN处a、b模块都已被加载且factory都是执行过的;
在上述代码中,CMD中虽然a、b模块在BEGIN处已被加载,但factory还没有执行,须要调用require执行依赖模块。在END处,a,b模块实际只执行了一个,这就是CMD中着重强调的延迟执行。
注意:AMD,CMD所说的执行是指factory函数的执行!文件异步加载完成,当即执行的是define函数(即当即注册模块),而模块化框架控制的是factory函数的执行顺序。