Javascript模块化编程--require.js（下）

五、AMD模块的写法

require.js加载的模块，采用AMD规范。也就是说，模块必须按照AMD的规定来写。

具体来说，就是模块必须采用特定的define()函数来定义。如果一个模块不依赖其他模块，那么可以直接定义在define()函数之中。

假定现在有一个math.js文件，它定义了一个math模块。那么，math.js就要这样写：

1 2 3 4 5 6 7 8 9

// math.js define( function (){ 　　 var add = function (x,y){ 　　　　 return x+y; 　　}; 　　 return { 　　　　add: add 　　}; });

加载方法如下：

1 2 3 4

// main.js require([ 'math' ], function (math){ 　　alert(math.add(1,1)); });

如果这个模块还依赖其他模块，那么define()函数的第一个参数，必须是一个数组，指明该模块的依赖性。

1 2 3 4 5 6 7 8

define([ 'myLib' ], function (myLib){ 　　 function foo(){ 　　　　myLib.doSomething(); 　　} 　　 return { 　　　　foo : foo 　　}; });

当require()函数加载上面这个模块的时候，就会先加载myLib.js文件。

六、加载非规范的模块

理论上，require.js加载的模块，必须是按照AMD规范、用define()函数定义的模块。但是实际上，虽然已经有一部分流行的函数库（比如jQuery）符合AMD规范，更多的库并不符合。那么，require.js是否能够加载非规范的模块呢？

回答是可以的。

这样的模块在用require()加载之前，要先用require.config()方法，定义它们的一些特征。

举例来说，underscore和backbone这两个库，都没有采用AMD规范编写。如果要加载它们的话，必须先定义它们的特征。

1 2 3 4 5 6 7 8 9 10 11 12

require.config({ 　　shim: {   　　　　 'underscore' :{ 　　　　　　exports: '_' 　　　　}, 　　　　 'backbone' :{ 　　　　　　deps: [ 'underscore' , 'jquery' ], 　　　　　　exports: 'Backbone' 　　　　} 　　} });

require.config()接受一个配置对象，这个对象除了有前面说过的paths属性之外，还有一个shim属性，专门用来配置不兼容的模块。具体来说，每个模块要定义（1）exports值（输出的变量名），表明这个模块外部调用时的名称；（2）deps数组，表明该模块的依赖性。

比如，jQuery的插件可以这样定义：

1 2 3 4 5 6

shim: { 　　 'jquery.scroll' :{ 　　　　deps: [ 'jquery' ], 　　　　exports: 'jQuery.fn.scroll' 　　} }

七、require.js插件

require.js还提供一系列插件，实现一些特定的功能。

domready插件，可以让回调函数在页面DOM结构加载完成后再运行。

1 2 3

require([ 'domready!' ], function (doc){ 　　 //called once the DOM is ready });

注：本文整理于伯乐在线，原文链接：http://blog.jobbole.com/30046/