前端模块化Commonjs和AMD、CMD以及ES6的演变

AMD
AMD “异步模块定义”。它采用异步方式加载模块，模块的加载不影响它后面语句的运行。主要用于浏览器端的JS加载，为了不造成网络阻塞。只有当依赖的模块加载完毕，才会执行回调。

AMD使用define来定义模块，require来加载模块。

define(math,dependencies?,factory);math) {
　　math.add(2, 3);
});

// Note: AMD允许输出的模块兼容CommonJS。
// RequireJS是AMD的一种实现。

CMD
Common Module Definition的缩写，也是一种异步模块定义规范，它和AMD的主要区别有两点：
1.对于模块的依赖，AMD是提前执行，CMD是延时执行。
2.AMD推崇依赖前置，CMD推崇就近依赖。

// AMD
define(['./a','./b'], function (a, b) {

    // 提前引入，预加载，性能略差
    a.test();
    b.test();
});

// CMD
define(function (requie, exports, module) {

    // 懒加载，用到时加载
    var a = require('./a');
    a.test();
});

UMD
UMD: 通用模块规范
从名字就可以看出来UMD做的是大一统的工作，把前后端加载糅合在了一起，提供了一个前后端统一的解决方案。既然CommonJs和AMD风格一样流行，似乎缺少一个统一的规范，支持AMD和CommonJS模式。

UMD的实现原理：
1.先判断是否支持Node.js模块格式（exports是否存在），存在则使用Node.js模块格式。
2.再判断是否支持AMD（define是否存在），存在则使用AMD方式加载模块。
3.前两个都不存在，则将模块公开到全局（window或global）

ES6模块和commonjs模块的区别

1.CommonJS是运行时加载，ES6是编译时加载，CommonJS模块就是对象，ES6是静态命令。

2.CommonJS先加载整个模块，然后直接生成对象，然后再从这个整体的对象上读取方法，ES6即在输入时可以指定加载摸个输出值的形式。而不是加载整个模块。

ES6要加载整个模块：  import * as DateComponents from './DateComponents.js';

3.如上所以CommonJS是先把整个模块加载完形成一个对象，在执行后面的操作，这意味着整个过程是一个同步事件，如果应用在服务器上，模块文件都存于本地硬盘加载比较快就不用考虑非同步加载的方式，所以CommonJS规范还是比较适用的。但是如果从浏览器环境，可能要从服务器端进行模块的加载 （可能导致性能上，可用性，调试和跨域访问等问题），这时就可能必须要使用非同步模式，所以就有了AMD规范。