CommonJS 和 AMD

Tomhsfreestyle 2019-06-26

对于前端开发者来说 CommonJS 和 AMD 是经常遇到的概念,那么 CommonJS 和 AMD 到底是什么呢?

CommonJS

CommonJS is a project with the goal of specifying an ecosystem for JavaScript outside the browser (for example, on the server or for native desktop applications).

维基百科说,CommonJS 是一个致力于规范化浏览器之外的 JavaScript 生态系统的项目(例如,在服务器端或者是原生的桌面应用程序)。

简单来讲,它是一个规范。根据这个规范,每个文件就是一个模块,有自己的作用域。在一个文件里面定义的变量、函数、类,都是私有的,对其他文件不可见。CommonJS 规范规定,每个模块内部,module变量代表当前模块。这个变量是一个对象,它的exports属性(即module.exports)是对外的接口。加载某个模块,其实是加载该模块的module.exports属性。

CommonJS 加载模块是同步的,所以只有加载完成才能执行后面的操作。像Node.js主要用于服务器的编程,加载的模块文件一般都已经存在本地硬盘,所以加载起来比较快,不用考虑异步加载的方式,所以CommonJS规范比较适用。但如果是浏览器环境,要从服务器加载模块,这是就必须采用异步模式。所以就有了 AMD,CMD 解决方案。

AMD(Asynchromous Module Definition)

CommonJS是主要为了js在后端的表现制定的,是不适合前端的,为什么这么说呢?这需要分析一下浏览器端的js和服务器端js都主要做了哪些事,有什么不同了:

CommonJS 和 AMD

于是乎,AMD(异步模块定义)出现了,它就主要为前端JS的表现制定规范。
AMD就只有一个接口:

define(id?,dependencies?,factory)

它要在声明模块的时候制定所有的依赖(dependencies),并且还要当做形参传到factory中,像这样:

define(['./a', './b'], function(a, b) { // 依赖必须一开始就写好
    a.doSomething()
    // 此处略去 100 行
    b.doSomething()
    ...
})

参考链接

1. JavaScript 标准参考教程(alpha)
2. amdjs/amdjs-api

相关推荐