javascript代码模块化解决方案

我们用模块化的思想进行网页的编写是为了更好的管理我们的项目，模块与模块之间是独立存在的，每个模块可以独立的完成一个子功能。

一、服务器和桌面环境中的Javascript代码模块化：CommonJS Modules/2.0 规范，特点是同步加载。

　　CommonJS是在浏览器环境之外构建JavaScript生态系统为目标产生的项目，比如服务器和桌面环境中。CommonJS规范是为了解决JavaScript的作用域问题而定义的模块形式，可以使每个模块在它自身的命名空间中执行。该规范的主要内容是：模块必须通过 module.exports导出对外的变量或接口，通过require()来导入其他模块的输出到当前模块。CommonJS是同步加载模块，Node是服务端语言，遵循的是CommonJS规范，同步加载模块，例如：
　　require("module");
　　require("../file.js");
　　exports.doStuff = function() {};
　　module.exports = someValue;

优点：

　　1.服务器端便于重用
　　2.NPM中已经将近20w个模块包
　　3.简单并容易使用

缺点：
　　1.同步的模块方式不适合在浏览器环境中，同步意味着阻塞加载，浏览器资源是异步加载的
　　2.不能非阻塞的并行加载多个模块

二、浏览器环境中的Javascript代码模块化：AMD和CMD规范，特点是异步加载。

1.AMD: define + require
　　对应的实现是 require.js （模块加载器），特点是依赖前置，推崇复用接口，不符合通用的模块思维方式，是一种妥协的实现。

2.CMD: exports + require
　　对应的实现是 sea.js （模块加载器），特点是依赖就近（相当于按需加载），推崇单用接口。

3.ES6: export + import

　　由于ES6本身是原生语言支持实现的模块化，但是现代浏览器大多都还未支持，因此必须使用相应的编译工具转换成ES5的AMD,CMD模块，再借助于systemjs/requirejs等模块加载器才能使用。其中ES6的编译一般是用babel，他的作用是可以使用ES6及更高版本，无需等待浏览器支持。

4.webpack：

　　webpack 是一个预编译的JavaScript ES6 模块打包器，由于是预编译的，不需要在浏览器中加载解释器。在本地直接写JS，不管是AMD/CMD/ES6风格的模块化，它都能认识，并且编译成浏览器认识的JS。