模块化心酸历史

话说原始时期js并没有模块化。模块化正如人类进化。随着前端的业务日益复杂，单页面应用与富客户端的流行，出现了模块化。

模块化好处

1. 代码分割
2. 隔离作用域
3. 解决模块之间相互依赖关系
4. 发布到生产环境自动打包与处理

流行模块化解决方案

1. 命名空间
2. 依赖注入
3. COMMONJS
4. AMD
5. UMD
6. es2015module

命名空间

1. 统一添加前缀，如App_config
2. 对象封装，将所有相关变量封装入全局对象中

缺点：多人协作可维护性差，没解决包依赖关系

依赖注入

依赖注入的核心思想在于某个模块不需要手动地初始化某个依赖对象，而只需要声明该依赖并由外部框架自动实例化该对象实现并且传递到模块内。

Angular／Angular2／Slot中依赖注入是核心机制之一。

COMMONJS

通过暴露require和module两个接口

用于服务端和客户端

AMD

解决异步问题，通过define和require两个接口

随着以 npm 为主导的依赖管理机制的统一，越来越多的开发者放弃了使用 AMD 模式

UMD

同时支持 CommonJS 与 AMD 规范的模块。

通过立即函数判断当前支持类型，传不同加载模式。比如AMD就传define。

es2015 Module

1. 导入语句只能作为模块顶层的语句出现，不能出现在 function 里面或是 if 里面
2. 并且 import 语句会被提升到文件顶部执行，也就是说在模块初始化的时候所有的 import 都必须已经导入完成
3. import 的模块名只能是字符串常量，导入的值也是不可变对象

结语

笔记笔记笔记！！！