seajs笔记

小小坤
253 阅读4分钟
原文链接： www.cnblogs.com

Amd和Cmd的区别有哪些？

1. 对于依赖的模块，AMD 是提前执行，CMD 是延迟执行。不过 RequireJS 从 2.0 开始，也改成可以延迟执行（根据写法不同，处理方式不同）。CMD 推崇 as lazy as possible.

2. CMD 推崇依赖就近，AMD 推崇依赖前置。看代码：

// CMD
define(function(require, exports, module) {
var a = require('./a')
a.doSomething()
// 此处略去 100 行
var b = require('./b') // 依赖可以就近书写
b.doSomething()
// ...
})

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

虽然 AMD 也支持 CMD 的写法，同时还支持将 require 作为依赖项传递，但 RequireJS 的作者默认是最喜欢上面的写法，也是官方文档里默认的模块定义写法。


3. AMD 的 API 默认是一个当多个用，CMD 的 API 严格区分，推崇职责单一。比如 AMD 里，require 分全局 require 和局部 require，都叫 require。CMD 里，没有全局 require，而是根据模块系统的完备性，提供 seajs.use 来实现模块系统的加载启动。CMD 里，每个 API 都简单纯粹。


4. 还有一些细节差异，具体看这个规范的定义就好，就不多说了。

 seajs使用

1.seajs.config--用来对 Sea.js 进行配置。

seajs.config({
      // 设置路径，方便跨目录调用
      paths: {
        'domes': 'http://127.0.0.1:8020/seajs-master'
      },
    
      // 设置别名，方便调用
      alias: {
        'dom': 'domes/dome/dom'
      },
       // 变量配置
      vars: {
           'locale': 'zh-cn'
      }
});
seajs.use('dom',function(d){
    //=> 加载的是 http://127.0.0.1:8020/seajs-master/dome/dom.js
    d.d();
});

别名起到了变量的作用，'dom'代表'domes/dome/dom'，'domes'代表'http://127.0.0.1:8020/seajs-master' 则'domes/dome/dom'解析为http://127.0.0.1:8020/seajs-master/dome/dom.js。

变量配置

define(function(require, exports, module){
    // 获取模块 dom_1 的接口    
    var som=require('./dom/{locale}.js');
    //加载的地址http://127.0.0.1:8020/seajs-master/dome/dom/zh-cn.js
    som.s();
    exports.dom_2=function(){
        console.log("dom_2");
    };
});

{locale}就代表'zh-cn'

2.seajs.use

// 加载一个模块
seajs.use('./a');

// 加载一个模块，在加载完成时，执行回调
seajs.use('./a', function(a) {
  a.doSomething();
});

// 加载多个模块，在加载完成时，执行回调
seajs.use(['./a', './b'], function(a, b) {
  a.doSomething();
  b.doSomething();
});

3.define--用来定义模块

define(id?, deps?, factory)
也可以接受两个以上参数。字符串 id 表示模块标识，数组 deps 是模块依赖。比如：
define('hello', ['jquery'], function(require, exports, module) {

});
id 和 deps 参数可以省略。省略时，可以通过构建工具自动生成。
注意：带 id 和 deps 参数的 define 用法不属于 CMD 规范，而属于 Modules/Transport 规范。

define(function(require, exports, module) {
  
  //exports 用来在模块内部对外提供接口。
   
  // 对外提供 foo 属性
  exports.foo = 'bar';

  // 对外提供 doSomething 方法
  exports.doSomething = function() {};
  //注意：require, exports, module这三个回掉函数参数切勿改变。
});

4.require--用来获取指定模块的接口

//注意，require 只接受字符串直接量作为参数，详细约定请阅读
//require.async 用来在模块内部异步加载一个或多个模块。
define(function(require) {

  // 获取模块 a 的接口
  var a = require('./a');

  // 调用模块 a 的方法
  a.doSomething();
  
  // 异步加载多个模块，在加载完成时，执行回调
  require.async(['./c', './d'], function(c, d) {
    c.doSomething();
    d.doSomething();
  });
  
  
});

5.exports--用来在模块内部对外提供接口

define(function(require, exports, module) {
  
  //exports 用来在模块内部对外提供接口。
   
  // 对外提供 foo 属性
  exports.foo = 'bar';

  // 对外提供 doSomething 方法
  exports.doSomething = function() {};
  //注意：require, exports, module这三个回掉函数参数切勿改变。
});

6.module.exports--用来在模块内部对外提供接口

define(function(require, exports, module) {

  // 对外提供接口
  module.exports = {
    name: 'a',
    doSomething: function() {};
  };

});

与 exports 类似，用来在模块内部对外提供接口。

7.require.resolve(id)--用来获取指定模块的绝对路径

define(function(require, exports, module){
    // 获取模块 dom_1 的接口  
    var som=require('./dom_2');
    console.log(require.resolve('./dom_2'),'用来获取指定模块的绝对路径');
   
});

这个可以用来检测你加载模块时候，路径是否正确。

参考链接

作者：玉伯
链接：https://www.zhihu.com/question/20351507/answer/14859415
来源：知乎
著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。

参考：https://github.com/seajs/seajs/issues/242

参考：https://github.com/amdjs/amdjs-api/wiki/AMD

参考：https://github.com/seajs/seajs/issues/266

参考：http://yslove.net/seajs/

总结

amd与cmd是一种规范，而目前两大加载器（seajs,requirejs）应用的规范是不同的。cmd推荐的是依赖就近原则，用到就加载。而amd则是依赖前置。只有加载才可以使用。相对于来说cmd比较符合使用习惯。

 

代码是一种神奇的东西，我们可以驱动它干好多事情。为什么我们不好好做一个控制者呢！！

打赏作者通道↓↓↓

如果觉得这篇文章不错的话！点击推荐支持一下哦！！！

avatar
文章
阅读
粉丝