🔥码云GVP开源项目 12k star Uniapp+ElementUI 功能强大 支持多语言、二开方便! 广告
[TOC] # 模块加载原理 [JS模块加载器加载原理是怎么样的?](https://www.zhihu.com/question/21157540) [getCurrentScript的改进](http://www.cnblogs.com/rubylouvre/archive/2013/01/23/2872618.html) [页面插入script内容总结](https://github.com/damoclesX/damoclesX.github.io/issues/17) [高性能网站优化 - 无阻塞加载脚本](https://zhanglun.github.io/2014/03/30/高性能网站优化-无阻塞加载脚本) [关于Function.prototype.toString的野生小技巧](http://leeluolee.github.io/2015/04/13/function-to-string/) ## AMD简单实现 [模块管理的简单实现方式](https://segmentfault.com/a/1190000006040968) # 传统JavaScript代码的问题 让我们来看看一般情况下JavaScript代码是如何开发的:通过`<script>`标签来载入JavaScript文件,用全局变量 来区分不同的功能代码,全局变量之间的依赖关系需要显式的通过指定其加载顺序来解决,发布应用时要通过工具来压缩所有的JavaScript代码到一个文 件。当Web项目变得非常庞大,前端模块非常多的时候,手动管理这些全局变量间的依赖关系就变得很困难,这种做法显得非常的低效. **模块化带来的最大弊端便是HTTP请求数增加,所以上线的时候必须合并文件。** ## 什么是模块化 在了解AMD,CMD规范前,还是需要先来简单地了解下什么是模块化,模块化开发? 模块化是指在解决某一个复杂问题或者一系列的杂糅问题时,依照一种分类的思维把问题进行系统性的分解以之处理。模块化是一种处理复杂系统分解为代码结构更合理,可维护性更高的可管理的模块的方式。可以想象一个巨大的系统代码,被整合优化分割成逻辑性很强的模块时,对于软件是一种何等意义的存在。对于软件行业来说:解耦软件系统的复杂性,使得不管多么大的系统,也可以将管理,开发,维护变得“有理可循”。 还有一些对于模块化一些专业的定义为:模块化是软件系统的属性,这个系统被分解为一组高内聚,低耦合的模块。那么在理想状态下我们只需要完成自己部分的核心业务逻辑代码,其他方面的依赖可以通过直接加载被人已经写好模块进行使用即可。 首先,既然是模块化设计,那么作为一个模块化系统所必须的能力: 1. 定义封装的模块。 2. 定义新模块对其他模块的依赖。 3. 可对其他模块的引入支持。 好了,思想有了,那么总要有点什么来建立一个模块化的规范制度吧,不然各式各样的模块加载方式只会将局搅得更为混乱。那么在JavaScript中出现了一些非传统模块开发方式的规范 CommonJS的模块规范,AMD(Asynchronous Module Definition),CMD(Common Module Definition)等。 **还好ES6 的模块化出来了,等到浏览器都实现 了,还需要这么复杂?**(参考:[ECMAScript 6 module and bundlers](http://www.meow.re/original/2016/08/30/es6-module-and-bundlers/))  如果你听过 js 模块化这个东西,那么你就应该听过或CommonJS或AMD甚至是CMD这些规范咯,我也听过,但之前也真的是听听而已。  现在就看看吧,这些规范到底是啥东西,干嘛的。