Js中的模块化是如何实现的

1、一、模块化需要解决的问题要对一个东西进行深入的剖析，有必要带着目的去看。模块化所要解决的问题可以用一句话概括在没有全局污染的情况下，更好的组织项目代码举一个简单的栗子，我们现在有如下的代码：

3、这样做的目的显而易见，更好的组织项目代码，注意到两个文件中的 require 和 module.exports，从现在的上傧萨犬凌帝视角来看，这出自 CommonJS 规范（后文会有一个章节来专门讲规范）中的关键字，分别代表导入和导出，这其实是模块化之路上需要解决的问题。另外，虽然 add 模块需要得到复用，并不希望在引入 add 的时候造成全局污染二、引入的模块如何运行在上述的例子中，已经将代码拆分到了两个模块文件当中，在不造成全局污染的情况下，如何实现 require，才能使得例子中的代码做到正常运行。先不考虑模块文件代码的载入过程，假设 require 已经可以从模块文件中读取到代码字符串，那么 require 可以这样实现

5、在上面的形式中，每个 arg 都是一个参数，最后一个参数是函数主体（要执行的代码）。这些参数必须是字符串。也就是说，可以使用它来执行字符串代码，类似于 eval，并且相比 eval, 还可以通过参数的形式传入字符串代码中的某些变量的值3）如果曾经你有疑惑过为什么规范的导出关键字只有 exports 而我们实际使用过程中却要使用module.exports（写过 Node 代码的应该不会陌生），那在这段代码中就可以找到答案了，如果只用 exports 来接收 context，那么对 exports 的重新赋值对 context 不会有任何影响（参数的地址传递），不信将代码改成如下形式再跑一跑：

7、要知道，设置了 <script> 标签的 src 之后，代码一旦下载完成，就会立即执行，根本由不得你再封装成闭包，所以文件模块需要在定义之初就要做文章，这就是我们说熟知的 AMD/CMD 规范中的 define，开篇的 add.js 需要重新改写一下

9、CommonJs 规范在 Node 中大放异彩并且相互促进，但是在浏览器端，鉴于网络的原因，同步的方式加载模块显然不太实用，在经过一段争执之后，AMD 规范最终在前端场景中胜出（全称 Asynchronous Module Definition，即“异步模块定义”）什么是 AMD，为什么需要 AMD ？在前述模块化实现的推演过程中，应该能够找到答案除此之外还有国内玉伯提出的 CMD 规范，AMD 和 CMD 的差异主要是，前者需要在定义之初声明所有的依赖，后者可以在任意时机动态引入模块。CMD 更接近于 CommonJS两种规范都需要从远程网络中载入模块，不同之处在于，前者是预加载，后者是延迟加载