[TOC] # 31. 模块系统和包管理器 JavaScript没有模块的内置支持，但社区创造了令人印象深刻的解决方法。为了管理模块，您可以使用所谓的包管理器，它负责处理发现、安装、依赖管理和更多。 ## 31．1 模块系统 JavaScript模块中两个最重要的标准（不幸的是不兼容的）是： ### CommonJS模块（CJS） 本标准主导的体现是`Node.js`模块（`Node.js`模块有几个超越CJS的特点）。其特点包括： * 紧凑的语法 * 专为同步加载设计 * 主要使用：服务端。 ### 异步模块定义（AMD） 本标准的最流行的实现是[`RequireJS`](http://requirejs.org/)。其特点包括： * 稍微复杂的语法，使AMD没有`eval()`或静态编译步骤的工作 * 专为异步加载设计 * 主要使用：浏览器端 ## 31．2 包管理器 当涉及到软件包管理器，**NPM**（Node Packaged Modules）是Node.js规范选择。对于浏览器来说，以下两个项很受欢迎（与其他相比）： * `Bower`是一个支持AMD和CJS的 Web包管理器。 * `Browserify`是一个工具，可以让你使用类似于 node 的 `require()` 的方式来组织浏览器端的 Javascript 代码，通过预编译让前端 Javascript 可以直接使用 Node NPM 安装的一些库。 ## 31．3 简单粗暴的模块实现 对于正常的web开发,，你应该使用一个模块系统，如`requirejs`或`Browserify`。然而，有时候你只想简单暴力一些把它放在一起。下面简单的模块模式可以帮助： ```js var moduleName = function () { function privateFunction () { ... } function publicFunction(...) { privateFunction(); otherModule.doSomething(); // implicit import } return { // exports publicFunction: publicFunction }; }(); ``` 上述是一个模块，存储在全局变量的`moduleName`。它做以下： * 隐式的导入依赖（模块`othermodule`） * 有一个私有的函数，`privateFunction` * 输出`publicFunction` 若要在网页上使用该模块，只需通过`<script >`标记加载其文件及其依赖项的文件： ```js <script src="modules/otherModule.js"></script> <script src="modules/moduleName.js"></script> <script type="text/javascript"> moduleName.publicFunction(...); </script> ``` 如果在加载一个模块时，其他模块没有被访问（这是`moduleName`的情况下），此时模块加载的顺序并不重要。 以下是我的意见和建议： * 我使用这个模块模式了一段时间，直到我发现我没有发明它，它有一个正式的名字。Christian Heilmann推广普及它，叫它"[揭示模块模式](https://addyosmani.com/resources/essentialjsdesignpatterns/book/#revealingmodulepatternjavascript)"。 * 如果您使用此模式，保持简单。可以随意用模块名称污染全局范围，但请尝试找到唯一名称。它只是为了极客（黑客），所以没有必要多么好看华丽（嵌套命名空间，模块分割多个文件，等等）。