模块化的理解

为什么要模块化开发？

1.代码重用，引入js文件数目减少了，避免代码的赘余；
2.代码复用率提高，开发效率提升；
3.方便后期维护。

模块化（模块化规范+模块化加载器）

CommonJs规范是node.js提出来的标准；
1.一个文件就是一个模块；
2.每个模块都有单独的作用域；
3.通过module.exports导出成员；
4.通过require函数载入模块。

如果在浏览器端也使用这个规范的话就会出现一些问题，CommonJS是以同步模式加载模块，执行过程中是不需要去加载的，它只会去使用到模块，这个模式在node中是没有问题的，但在浏览器端就不太合适了，因为每个页面的加载都会导致大量的同步请求出现，所以在早期的模块化中，并没有选择CommonJS这个规范，而是结合浏览器的特点，重新设计了一个规范，叫做AMD(Asynchronous Module Definition),同时还有require.js的出现，它实现了AMD这个规范，它本身也是强大的模块加载器。

现流行的模块化开发主要有两种方式：

1. 依赖加载。这种方式最广泛的，像require.js,sea.js,除了编码规范不一样，实际都是通过相关require.api把模块chunk文件拿回来，当加载完成之后再运行，逻辑代码。
2. 依赖打包。经典代表就是webpack，其实就是写代码的时候分开模块，但打包的时候按照依赖关系找到各个模块，最后打包到同一文件上，并且给每个chunk标识id，运行逻辑代码时将模块引用指向该id,从而实现模块化。

ES6与CommonJS不同

1. CommonJs在运行时完成加载，而es6模块是在编译时完成模块加载，效率更高；
2. CommonJs模块是对象，而ES6可以是任何数据类型，通过export命令指定输出的内容，并通过import命令引入即可；
3. CommonJs模块会在require加载时完成执行，而ES6的模块是动态引用，只在执行时获取模块中的值。