RequireJS以及AMD规范入门实践

RequireJS以及AMD规范入门实践

首先申明，在下也只是刚开始了解这东西，所以说的不对不全的地方，随时欢迎各位拍砖指导·

AMD规范：

amd规范具体说明可以参见各种文档，这里不细说了，大概就是说模块用define定义，并返回一个类似句柄的什么鬼。下面列一下怎么用吧：

define('name', ['module1', 'module2'], function(m1, m2){
    var abc = function(param){
        console.log(param);
        // TODO
    };
    return {
        sout:abc
    }
});

这样一个模块就定义好了，下面对这个定义做几点说明：

• 注意，最好是文件名和模块的唯一标识一样，不然会出现一些让然蛋疼的问题。。。文件名是什么就不说了，模块唯一标识就是上面的 name 是一个字符串，写在define的第一个位置上。
• define的第二个参数是此模块依赖的模块，可以没有，也可以有多个， 这个是一个数组， 顺序跟后面回调函数的参数一一对应
• 第三部分是回调函数， 这个模块不会阻塞，因为加载依赖模块需要时间，所有后面的回调函数会在依赖全部加载完才执行， m1对应module1， m2对应module2
• 里面就是正常js函数的写法了，不过不在return里写的话，外部是调用不了的，这也算是一个不错的封装吧。。。

---

RequireJS使用

还是一样，require.js文件大家可以去官网下载 http://www.requirejs.cn/ …………官网里还有一堆介绍，挺不错的
使用的时候通常会在前面先定义：

require.config({
      baseUrl:  '',
      paths:{
        'name': 'jsName'
      },
      shim:{
          'backbone': {
            //These script dependencies should be loaded before loading
            //backbone.js
            deps: ['underscore', 'jquery'],
            //Once loaded, use the global 'Backbone' as the
            //module value.
            exports: 'Backbone'
        },
      }
  })

配置大概就是这么写，具体还有哪些属性，大家可以查询官网：

• baseUrl表示js的根目录，这个不用详说了吧.
• paths下面是一个对象，表示依赖的js以及别名，别名怎么写，你自己开心就好，不过鉴于规范，最好还是取得跟js本身的名字类似吧。。。
• shim是为那些并没有很好实现amd规范的js文件准备的，(AMD规范里定义了文件的依赖关系，详见define模块，但有些没有遵循这个规范，及没有定义依赖关系，所以我们这里需要手动定义依赖关系。)里面的deps是它所依赖的js文件，exports是输出的名字，具体来说，官网肯定比我说的好···

使用的时候：

require(['jquery', 'utils'], function($, util){
    // TODO
})

这里是官方给的例子，挺好的，但是我一直纠结的问题是，他这么写是不是就不建议我们一个js文件里只有一个requeir（）方法呢？比如我的业务逻辑比较复杂，那该怎么写呢？

后来就自己思考，并看了一下AMD和CMD规范，发现CMD是这么写的：

var a = require('jquery');
// TODO
var b = require('util');
// TODO

因为开始AMD规范是不支持异步加载的，那么这样就有问题了，就是文件还没下载下来的话，后面的代码是不会执行的，就是浏览器要等待，如果文件比较大，那么浏览器可能就有假死现象，所以AMD规范采用了这种方式来做异步。

那么这个方式只是做异步的而已哦···那么一个页面完全可以写多个require()了么，比如这样：

require(['jquery'], function($){
    // TODO
    require(['utils'], function(util){
        // TODO
    })
})

所以呢，requeir这个写法就是一句，当你需要依赖某个js插件的时候，用这种方式去加载而已。仅仅是按需加载。

各位有什么问题随时欢迎拍砖！