Javascript 的模块化编程及加载模块【转载+整理】

http://www.ruanyifeng.com/blog/2012/10/javascript_module.html

• 引入
• 模块化
  • 最初写法
  • 对象写法
  • 立即执行函数写法
  • 放大模式
  • 宽放大模式
  • 把模块作为参数
• 模块化规范：CommonJS 和 Asynchronous Module Definition
  • CommonJS
  • Asynchronous Module Definition
• 用 require.js 加载模块

 

引入

---

1995 年 Javascript 诞生时，只是一种为了用于交互的简单的网页脚本语言，像如果你忘记填写用户名，就跳出一个警告，当时的网速只有 28Kbps，这样简单的交互也让 Web 服务器做显然不合适。

如今，Javascript 几乎无所不能，从前端到后端，各种匪夷所思、令人瞠目结舌的用途，程序员用它完成越来越庞大的项目，代码复杂度也在直线飙升。单个网页包含 10000 行 Javascript 代码，早就司空见惯。2010 年，一个工程师透露：Gmail 代码长度是 443000 行！另外，Web 应用程序越来越像桌面应用程序，需要一个团队分工协作、进度管理、单元测试等等，开发者不得不使用软件工程的方法，管理网页的业务逻辑。

编写和维护越来越庞大复杂的代码将越来越困难。Javascript 模块化编程，已经成为一个迫切的需求。理想情况下，开发者只需要实现核心的业务逻辑，其他都可以加载别人已经写好的模块。但是，Javascript 不是一种模块化编程语言，其语法不支持“类”，更别说“模块”了。

正在制定中的 ECMAScript标准 第六版，将正式支持“类”和“模块”，但还需要很长时间才能投入实用。

鉴于此，Javascript 社区做了很多努力。本文总结了当前＂Javascript 模块化编程＂的最佳实践。但是，在此之前，你最好还是体会一下如何用 Javascript 模拟“类”，这是进行 Javascript 模块化编程和其面向对象编程的基础，进而使用面向对象的继承、接口，甚至是设计模式。

 

模块化

---

最初写法

该方法，你肯定不陌生，但凡是开始写 Javascript 代码的人，都是从这种方法开始的。几个在一起的函数就是一个模块。如下所示：

function m1(){

　　　　// do something

　　}

　　function m2(){

　　　　// do something

　　}