模块化
**概念：**将一个复杂的程序依据一定的规则（规范）封装成几个块（文件）并进行组合。
模块的内部数据的实现是私有的，只是向外部暴露一些接口（方法）与外部其他模块通信，这就是模块化。
**优点：**模块化可以降低代码耦合度，减少重复代码，提高代码重用性，并且在项目结构上更加清晰，便于维护。
AMD、CMD、CommonJs、ES6的对比
他们都是用于在模块化定义中使用的，AMD、CMD、CommonJs是ES5中提供的模块化编程的方案，import/export是ES6中定义新增的
AMD
AMD是RequireJS在推广过程中对模块定义的规范化产出，它是一个概念，RequireJS是对这个概念的实现，就好比JavaScript语言是对ECMAScript规范的实现。AMD是一个组织，RequireJS是在这个组织下自定义的一套脚本语言
RequireJS：是一个AMD框架，可以异步加载JS文件，按照模块加载方法，通过define()函数定义，第一个参数是一个数组，里面定义一些需要依赖的包，第二个参数是一个回调函数，通过变量来引用模块里面的方法，最后通过return来输出。
是一个依赖前置、异步定义的AMD框架（在参数里面引入js文件），在定义的同时如果需要用到别的模块，在最前面定义好即在参数数组里面进行引入，在回调里面加载
define(['./a', './b'], function(a, b) {
a.do();
b.do();
});
define(function(require,exports,module){
var a = require('./a');
a.doSomething();
var b = require('./b');
b.doSomething();
});
CMD
是SeaJS在推广过程中对模块定义的规范化产出，是一个同步模块定义，是SeaJS的一个标准，SeaJS是CMD概念的一个实现，SeaJS是淘宝团队提供的一个模块开发的js框架.
通过define()定义，没有依赖前置，通过require加载jQuery插件，CMD是依赖就近，在什么地方使用到插件就在什么地方require该插件，即用即返，这是一个同步的概念
define(id?, deps?, factory)
factory是一个函数，有三个参数，function(require, exports, module)
- require 是一个方法，接受 模块标识 作为唯一参数，用来获取其他模块提供的接口：require(id)
- exports 是一个对象，用来向外提供模块接口
- module 是一个对象，上面存储了与当前模块相关联的一些属性和方法
// 定义模块 module.js
define(function(require, exports, module) {
var $ = require('jquery.min.js')
$('div').addClass('active');
});
// 加载模块
seajs.use(['module.js'], function(my){
});
AMD与CMD区别
AMD和CMD最明显的区别就是在模块定义时对依赖模块的执行时机处理不同。
1、AMD推崇依赖前置，在定义模块的时候就要声明其依赖的模块
js可以方便知道依赖模块是谁，立即加载；
2、CMD推崇就近依赖，只有在用到某个模块的时候再去require
需要使用把模块变为字符串解析一遍才知道依赖了那些模块，牺牲性能来带来开发的便利性，实际上解析模块用的时间短到可以忽略。
ES6
ES6模块的主要有两个功能：export和import。
- export用于对外输出本模块（一个文件可以理解为一个模块）变量的接口。
- import用于在一个模块中加载另一个含有export接口的模块。
也就是说使用export命令定义了模块的对外接口以后，其他JS文件就可以通过import命令加载这个模块（文件）。
//util1.js
export default {
a: 100
}
//index.js
import util1 from './util1.js'
console.log(util1);
//util2.js
export function fn1() {
alert('fn1');
}
export function fn2() {
alert('fn2');
}
//index.js
import { fn1, fn2 } from './util2.js'
fn1();
fn2();
CommonJs
是通过module.exports定义的，在前端浏览器里面并不支持module.exports，通过node.js后端使用的。Nodejs端是使用CommonJS规范的，前端浏览器一般使用AMD、CMD、ES6等定义模块化开发的。
加载模块使用require方法，该方法读取一个文件并执行，最后返回文件内部的exports对象。
CommonJS定义的模块分为：{模块引用(require)} {模块定义(exports)} {模块标识(module)}
- require()用来引入外部模块；
- exports对象用于导出当前模块的方法或变量，唯一的导出口；
- module对象就代表模块本身。
// a.js
module.exports = {
a: 1;
}
// or
exports.a = 1;
// b.js
var module = require('./a.js');
module.a; // 1
commonjs和ES6模块化的区别
- 前者支持动态导入，也就是require(${path}/xx.js)，后者目前不支持，但是已有提案
- 前者是同步导入，因为用于服务端，文件都在本地，同步导入即使卡住主线程影响也不大。而后者是异步导入，因为用于浏览器，需要下载文件，如果也采用导入会对渲染有很大影响
- 前者在导出时都是值拷贝，就算导出的值变了，导入的值也不会改变，所以如果想更新值，必须重新导入一次。但是后者采用实时绑定的方式，导入导出的值都指向同一个内存地址，所以导入值会跟随导出值变化。
- 后者会编译成require/export来执行