Snandy
停下来,思考才是进步的本质。
AMD:浏览器中的模块规范
前面提到,为实现与NodeJS相同方式的模块写法,大牛们做了很多努力。
但由于浏览器环境不同于服务器端,它的模块有一个HTTP请求过程。这个请求过程多数使用script tag,script tag默认的异步性导致很难实现与NodeJS一模一样的模块格式。
Modules/Wrappings 使得实现变为现实。虽然和NodeJS的模块写法不完全一致,但也有很多相似之处,使得熟悉NodeJS的程序员有一些亲切感。
但NodeJS终究是服务器端的JavaScript,没有必要把这些条条框框放到浏览器JavaScript环境中。这时AMD 诞生了,它的全称为异步模块定义。从名称上看便知它是适合script tag的。也可以说AMD是专门为浏览器中JavaScript环境设计的规范。它吸取了CommonJS的一些优点,但又不照搬它的格式。开始AMD作为CommonJS的transport format 存在,因无法与CommonJS开发者达成一致而独立存在。它有独立的wiki 和讨论组 。
AMD设计出一个简洁的写模块API:define 。
define(id?, dependencies?, factory);
其中:
- id: 模块标识,可以省略。
- dependencies: 所依赖的模块,可以省略。
- factory: 模块的实现,或者一个JavaScript对象。
1
2
3
4
5
6
|
define( function () { return { mix: function (source, target) { } }; }); |
ui.js
1
2
3
4
5
6
7
|
define([ 'base' ], function (base) { return { show: function () { // todo with module base } } }); |
page.js
1
2
3
|
define([ 'data' , 'ui' ], function (data, ui) { // init here }); |
data.js
1
2
3
4
|
define({ users: [], members: [] }); |
1
2
3
|
define( 'index' , [ 'data' , 'base' ], function (data, base) { // todo }); |
1
2
3
4
5
6
|
define( function (require, exports, module) { var base = require( 'base' ); exports.show = function () { // todo with module base } }); |
Snandy
停下来,思考才是进步的本质。
modular js
AMD:浏览器中的模块规范
posted @ 2012-03-12 07:59 snandy 阅读(787) | 评论 (1) 编辑
Node.js模块格式在浏览器中的尝试
posted @ 2012-03-09 07:30 snandy 阅读(1249) | 评论 (3) 编辑
JavaScript中模块“写法”
posted @ 2012-03-08 07:42 snandy 阅读(1403) | 评论 (0) 编辑
拥抱模块化的JavaScript
posted @ 2012-03-07 07:27 snandy 阅读(1920) | 评论 (2) 编辑