# 模块化
AMD,CMD,CommonJS,ES6 Module 他们都是用于在模块化定义中使用的, AMD、CMD、CommonJS是ES5中提供的模块化编程的方案,import/export是ES6中定义新增的。
# 一、AMD
AMD是RequireJS在推广过程中对模块定义的规范化产出,RequireJS是一个AMD框架,可以异步加载JS文件,按照模块加载方法,通过define()函数定义,第一个参数是一个数组,里面定义一些需要依赖的包,第二个参数是一个回调函数,通过变量来引用模块里面的方法,最后通过return来输出。
特点:依赖前置、预执行
define(['./a', './b'], function(a, b) {
//运行至此,a.js和b.js已经下载完成
//a模块和b模块已经执行完
a.doing();
b.doing();
});
1
2
3
4
5
6
2
3
4
5
6
# 二、CMD
CMD是SeaJS在推广过程中对模块定义的规范化产出,通过define()定义,没有依赖前置,通过require加载插件,CMD是依赖就近,在什么地方使用到插件就在什么地方require该插件,即用即返,这是一个同步的概念。
特点:依赖就近、懒执行
define(function(require, exports, module) {
var a = require("./a");
//等待a.js下载、执行完
a.doing();
var b = require("./b");
//等待b.js下载、执行完
b.doing();
});
1
2
3
4
5
6
7
8
2
3
4
5
6
7
8
# 三、CommonJS规范
Nodejs端是使用CommonJS规范的,通过module.exports定义。CommonJS定义的模块分为:模块引用(require)、模块定义(exports)、模块标识(module)。
module.exports和exports都是什么呢?
module中其实带有的exports属性,就是我们对外的接口。也就是说,module.exports属性表示当前模块对外输出的接口,其他文件加载该模块,实际上就是读取module.exports变量。
而exports变量,实际上是nodeJS为了方便,为每个模块提供一个exports变量,指向module.exports。这等同在每个模块头部,有一行这样的命令。
var exports = module.exports;
1
因此,我们可以直接向exports对象添加方法
exports.area = function (r) {
return Math.PI * r * r;
};
exports.circumference = function (r) {
return 2 * Math.PI * r;
};
1
2
3
4
5
6
7
2
3
4
5
6
7