JS里的模块化
定义
模块化开发是一种管理方式，是一种生产方式，一种解决问题的方案，一个模块就是实现特定功能的文件，有了模块，我们就可以更方便地使用别人的代码，想要什么功能，就加载什么模块。
规范
- AMD(依赖前置)
- CMD(依赖就近)
- CommonJS
- ES6的模块化
AMD规范（异步模块定义）
AMD依赖前置，即在定义模块的时候就要声明其依赖的模块。使用此规范的代表有requireJS。
requireJS定义了一个函数 define，它是全局变量，用来定义模块.
define(id?, dependencies?, factory)
- id：可选参数，用来定义模块的标识，如果没有提供该参数，脚本文件名（去掉拓展名）
- dependencies：是一个当前模块依赖的模块名称数组
- factory：工厂方法，模块初始化要执行的函数或对象。如果为函数，它应该只被执行一次。如果是对象，此对象应该为模块的输出值
- 在页面上使用require函数加载模块
require([dependencies], function(){})
- 第一个参数是一个数组，表示所依赖的模块
- 第二个参数是一个回调函数，当前面指定的模块都加载成功后，它将被调用。加载的模块会以参数形式传入该函数，从而在回调函数内部就可以使用这些模块
CMD规范（通用模块定义）
CMD依赖就近，即只有在用到某个模块的时候再去require，使用此规范的代表有seaJS。
Sea.js 推崇一个模块一个文件，遵循统一的写法。
define(id?, deps?, factory)
factory是一个函数，有三个参数，function(require, exports, module)
- require 是一个方法，接受 模块标识 作为唯一参数，用来获取其他模块提供的接口：require(id)
- exports 是一个对象，用来向外提供模块接口
- module 是一个对象，上面存储了与当前模块相关联的一些属性和方法
CommonJS
NodeJS就采用了CommonJS。
//模块中使用module.export导出 //使用则使用require导入
ES6的模块化
ES6提供的模块化
// 导入用import // 导出用export
import和require区别
相同点：
作用和行为上基本一致，都是以阻塞的方式载入模块
区别：
|
|
require |
import |
|
加载 |
运行时加载(即动态加载) |
在编译时加载(即静态加载) |
|
导入 |
导入整个模块对象，不能仅导入部分内容 |
可以导入模块中的所有导出内容或者部分导出内容 |
|
导出 |
module.export 之后,导出的值就不能再变化(输出值的拷贝) |
export之后导出的值可以变化（输出值的映射）
|
|
书写位置 |
可以写在代码任何地方执行比如if判断当中 |
必须写在文件的顶部 |
|
性能 |
性能较低，因为require是在运行时才引入模块并且还赋值给某个变量 |
性能较高，因为import只需要依据import中的接口在编译时引入指定模块所以性能稍高 |
值的拷贝和值的映射示例：
var a = 6 export default {a} a = 7 //在es6中的export可以 var a = 6 module.export = a a = 7 //在common.js中，这样是错误的
import()动态导入
webpack实际上会将ES导入转换为CommonJS规范
