前端开发一直在强调js模块化，将一个功能当做一个模块来开发，js本身并没有模块的功能。JS中的模块化规范主要有：
- AMD，即 Asynchronous Module Definition: 异步模块定义：这种规范可以异步的加载或依赖其他模块， Require.js就遵循的AMD规范 。
- CMD，即 Common Module Definition，CMD则是依赖就近，用的时候再require。玉伯写的sea.js 就是遵循的CMD规范。
- CommonJS，NodeJS就采用了CommonJS。
- UMD，即通用模块定义，UMD规范兼容AMD 和 CommonJs。
AMD 规范
AMD规范只定义了一个函数 "define"，它是全局变量。函数的描述为：
// '?' 表示该参数是可选的
define(id?, dependencies?, callback);
- id，是个字符串， 指定模块的名字。如果没有提供该参数，模块的名字应该默认为模块加载器请求的指定脚本的名字。如果提供了该参数，模块名必须是“顶级”的和绝对的（不允许相对名字）。
- dependencies，是个数组， 指定该模块依赖的模块数组。依赖模块依次执行，并且执行的结果，应该按照依赖模块数组中的位置顺序以参数的形式传入callback中。
- factory，依赖模块加载成功之后的回调函数或对象，如果为函数，它应该只被执行一次。如果是对象，此对象应该为模块的输出值。。
AMD规范定义了三个特殊的依赖关键字。如果"require","exports", 或 "module" 出现在依赖列表中，参数应该按照CommonJS模块规范自由变量去解析。
如果依赖参数没传，默认为["require", "exports", "module"]。然而，如果factory的形参个数小于3，加载器会选择以函数指定的参数个数调用factory。
AMD 定义模块：
// 要在声明模块的时候指定所有的依赖(dep)，并且还要当做形参传到factory中
// 这里的依赖是jquery
define(['jquery'], factory($) {
return {
myMethod: function() {
console.log('AMD 规范');
}
};
})
一个使用Simplified CommonJS Wrapping的模块定义：
define(function (require, exports, module) {
var a = require('a'),
b = require('b');
exports.action = function () {};
};
})
CMD 规范
CMD, 是seajs推崇的规范，CMD则是依赖就近，用的时候再require。写法如下：
// define(factory方法)
define(function(require, exports, module) {
var a = require('a');
a.hello();
});
AMD和CMD都是异步加载模块，最大的区别是对依赖模块的执行时机不同，而不是加载方式不同。
- AMD依赖前置，提前执行，依赖模块一目了然；
- CMD依赖就近，并行加载所有依赖的模块, 但不会立即执行模块, 等到对应 require 语句时，才执行模块。因此CMD需要从factory.toString() 中提取到依赖模块，这会导致更长的等待时间，实际上解析模块用的时间短到可以忽略。
CommonJS 规范
NodeJS的模块系统就是遵循CommonJS规范实现的。CommonJS是主要为了JS在后端的表现制定的，实现CommonJS规范的API是同步加载模块的， 因为在服务端模块的加载一般是从本地磁盘中读取，加载速度很快，不像客户端端需要发送请求加载， 可能出现'假死'状况。
CommonJS定义的模块分为:
- 模块引用(require)：用来引入外部模块
- 模块定义(exports)：用于导出当前模块的方法或变量，唯一的导出口
- 模块标识(module)：module对象就代表模块本身
//add.js
exports.add = function(x, y){
return x+y;
};
//main.js
var math = require('add');
exports.add = function(n){
return math.add(100, n);
};
Browserify(http://browserify.org/) 是目前最常用的 CommonJS 格式转换的工具, 能够将commonJs规范的代码转换为浏览器可直接执行的代码。
虽说Node遵循CommonJS的规范，但是相比也是做了一些取舍，填补了一些新东西的。
UMD（通用模块规范）
UMD规范则是兼容了 AMD 和 CommonJs。
(function (root, factory) {
if (typeof define === 'function' && define.amd) {
// AMD
define(['jquery'], factory);
} else if (typeof exports === 'object') {
// Node, CommonJS之类的
module.exports = factory(require('jquery'));
} else {
// 浏览器全局变量 (root 即window)
root.returnExports = factory(root.jQuery);
}
}(this, function ($) {
function add(){};
// 暴露公共方法
return {
add: add
};
}));
ES6中的模块化
- ES6 模块的设计思想，是尽量的静态化，使得编译时就能确定模块的依赖关系，以及输入和输出的变量。
Require是CommonJS的语法，CommonJS的模块是对象，输入时必须查找对象属性。
// CommonJS模块
let { stat, exists, readFile } = require('fs');
Commonjs：整体加载fs模块（即加载fs所有方法），生成一个对象"_fs"，然后再从这个对象上读取三个方法，这叫“运行时加载”，因为只有运行时才能得到这个对象，不能在编译时做到静态化。
ES6模块不是对象，而是通过export命令显示指定输出代码，再通过import输入。
ES6模块是编译时加载：模块之间的依赖关系，在运行之前（即编译时）就通过静态分析来确定好了的。
// 从fs加载“stat, exists, readFile” 三个方法，其他方法不加载，这是编译时加载，也叫静态加载
import { stat, exists, readFile } from 'fs';
- ES6 的模块自动采用严格模式，不管你有没有在模块头部加上"use strict";。
- ES6使用import, export 实现的模块化。import 用来导入其它模块， export 用来输出对外的接口，可以是变量，函数和类。
export 关键字
一个模块就是一个独立的文件。该文件内部的所有变量，外部无法获取。如果你希望外部能够读取模块内部的某个变量，就必须使用export关键字输出该变量。
export可以输出变量、函数和类，但不可以直接输出值，否则会报错，因为export命令规定的是对外的接口，必须与模块内部的变量建立一一对应关系。
const sum = function(a, b) {
return a+b;
}
const minus = function(a, b) {
return a-b;
}
// 同一个模块可以有多个export 命令语句。
export {
sum
}
// as 关键字用来重命名变量
export {
minus as reduce
}
注意：export不能输出值，并且它输出的变量函数名或者类名要放在"{ }"中
export default命令
export default为模块指定默认输出，一个模块只能有一个默认输出。
可以理解为：export default 就是输出一个叫做default的变量， 系统允许你为它取任意名字。
export default sum(a, b) {
return a+b;
}
import:
- 使用import加载export输出的接口， 必须用{ }包住
import {sum as add, reduce } from './index.js';
- 使用import加载export default 输出的接口
// 方式1
import sum from './index.js';
// 方式2： 可以任意命名
import default as foo from './index.js';
注意：
- import只会导入一次，无论你引入多少次, import语句是 Singleton 模式。
有提升效果，import会自动提升到顶部，首先执行
import { foo } from 'my_module';
import { bar } from 'my_module';
// 等同于
import { foo, bar } from 'my_module';
- 由于import是静态执行，所以不能使用表达式和变量，这些只有在运行时才能得到结果的语法结构。
- 循环加载时，ES6模块是动态引用。只要两个模块之间存在某个引用，代码就能够执行。
