# 模块化
前端模块化详解(完整版) (opens new window) JS 模块规范：AMD、UMD、CMD、commonJS、ES6 module (opens new window)
# 什么是模块化？解决了什么问题？
- 文件隔离
- 暴露变量与函数
# 早期办法
全局 function
- 看不出关联依赖 污染全局
对象模式 定义一个变量 导出这个对象的变量与方法
- 作用: 减少了全局变量，解决命名冲突 问题: 数据不安全(外部可以直接修改模块内部的数据)
IIFE 模式：匿名函数自调用(闭包)
IIFE 模式增强 : 引入依赖
# 模块化的规范
# CommonJS
在服务器端，模块的加载是运行时同步加载的；在浏览器端，模块需要提前编译打包处理。
加载某个模块，其实是加载该模块的 module.exports 属性
require 命令的基本功能是，读入并执行一个 JavaScript 文件，然后返回该模块的 exports 对象。如果没有发现指定模块，会报错。
CommonJS 模块的加载机制是，输入的是被输出的值的拷贝。也就是说，一旦输出一个值，模块内部的变化就影响不到这个值
# AMD
如果是浏览器环境，要从服务器端加载模块，这时就必须采用非同步模式，因此浏览器端一般采用 AMD 规范
定义及使用引入 require.js
<script data-main="js/main" src="js/libs/require.js"></script>
# CMD
CMD 规范专门用于浏览器端
sea.js
# UMD
兼容 AMD 和 commonJS 规范的同时，还兼容全局引用的方式
# ES6 模块化
# ES6 模块与 CommonJS 模块的差异
CommonJS 模块输出的是一个值的拷贝，ES6 模块输出的是值的引用。
CommonJS 模块是运行时加载，ES6 模块是编译时输出接口。