seajs api 学习小结（模块化开发）

转载：http://www.w3cfuns.com/blog-5434745-5404089.html

seajs 官方api文档： https://github.com/seajs/seajs/issues/266
seajs 简易api文档：http://yslove.net/seajs/

1.加载多个模块

当模块a  和 模块b 都加载完成时，开始执行回调函数

seajs.use(['./a','./b'],function(a,b){

     //执行回调函数

});

2.加载单个模块

当加载摸一个模块的时候，执行回调函数

seajs.use('./main',function( main ){

     //加载模块main 并在加载完成之后执行回调

     main.init( );

});

3.seajs.use 与 dom ready 之间的关系

注意：seajs.use 与 DOM ready 事件没有任何关系。如果某些操作要确保在 DOM ready 后执行，需要使用jquery 等类库来保证，比如：

seajs.use(['jquery','./main'],function($,main){

     //通过引入jquery 加入$(document).ready

     $(document).ready(function(){

          main.init();

     });

});

4.seajs 配置相关

（1） alias 属性：alias 用于别名配置：可以通过模块名更方便的加载模块,可以设置url 也可以设置文件路径

  seajs.config({

     base:'../sea-modules/',

     alias:{

        "jquery":"http://static.alipayobjects.com/jquery//1.7.2/jquery.js",（绝对路径）

         "jquery":"/jquery/1.10.1/jquery.js"(相对路径)

     }

});

（2）path 属性：设置path 很有用，可以在不影响base 的情况下，跨路径调用文件

设置路径，方便跨目录调用。通过灵活的设置path可以在不影响base的情况下指定到某个目录。

举个栗子：

seajs.config({

               alias:{

                    //设置要引入模块的别名

                    'module2':'module2.js',

                    'datajson':'datajson.js'

               },

               paths:{

                    //路径配置

                    'jqpath':'../js' -------> 路径配置

               }

});

seajs.use(['jqpath/jquery','module2'],function($,module2){

     $(document).ready(function(){

           //xxxx   xxxx   xxxxx

     });

});

注意：这里有一个要注意的地方！！！！当我们把从sea-modules 下载下来的例子里面封装好的jquery 拿到外面来的时候，我们要注意：jquery 文件里面有句：

"function"==typeof define && define("jquery/jquery/1.10.1/jquery",[],function(){return x}))}

这是sea.js 使用过程中非常著名的错误！ID和路径匹配原则#930   https://github.com/seajs/seajs/issues/930

红字部分是要基于你现在的文件路径，进行修改的，如果你把它移动到了外面，它是根据seajs 的base 进行写的路径，所以要注意移动后一定要按base 重改，不然你会发现console.log($);为空

5.CMD 模块定义规范，在sea.js 中所有的模块定义都是遵循CMD 规范的,以下具体内容参照：https://github.com/seajs/seajs/issues/242

在CMD 模块中一个模块就是一个文件：

（1）define 用来定义模块，define(factory) 是一个函数，其参数是factory,factory 可以是一个：  函数，对象，字符串

函数：define(function(require,exports,module){});

对象：常用语一个json 文件

     define({name:'ann',age:23,fruits:['strawberry','peach']});

字符串：也可以通过定义字符串来实现模板模块

     define('I am a template. My name is {{name}}.');

(2)define 也可以接受多个参数

define( id,deps,factory);

参数解释:  id 标识，deps 依赖数组， factory 函数

id 是模块标识

deps 是模块数组依赖

id 与 deps 可以省略，通过构建工具可以自动添加和生成

（3）require 加载模块

require用来获取其他模块提供的接口,通过require.async() 可以异步加载模块, require.resolve('模块路径/模块名')解析对应的模块路径

require.async(‘jquery’);

require.resolve():  使用模块系统内部的路径解析机制来解析并返回模块路径。该函数不会加载模块，只返回解析后的绝对路径。

(4) exports 相关用法

module.exports Object: 当前模块对外提供的接口

exports.方法名 = function(){

     //xxxx   xxxx 

}

module.exports = {

     //对象！

}

eg.

a. exports.sayHello = function(){

     alert('Hello World!');

}

b. module.exports = {

     name:'ann',

     sayName:function(){

          alert(this.name);

     },

     setName:function(name){

          this.name = name;

     },

     getName:function(){

          alert(this.name);

     }

}

c. function module(){

     this.prop = "initial";

   }

   module.prototype = {

     init:function(){

          alert(this.prop);

     },

     setValue:function(value){

          this.prop = value;

     },

     getValue:function(){

          alert(this.prop);

     }

   }

   module.exports = module;

//假设上面module.exports 是定义在moduletest.js 中的，那么我们这么使用

a.返回的是方法

  define(function(require,exports,module){

      var module1 = require('./moduletest 文件路径');

      module1.sayHello();

  })

b.返回的是对象

define(function(require,exports,module){

     var module1 = require('./moduletest 文件路径');

     module1.setName('annlinkey');

     module1.sayName();

});

c.返回的是构造函数

define(function(require,exports,module){

  var Module1 = require('./moduletest 文件路径');

  var module1ins = new Module1();

  module1ins.init();

  module1ins.setValue('ann');

  module1ins.getValue();

});

小结：

这就是 CMD 模块定义规范的所有内容。经常使用的 API 只有 define, require, require.async, exports,module.exports 这五个。其他 API 有个印象就好，在需要时再来查文档，不用刻意去记。

与 RequireJS 的 AMD 规范相比，CMD 规范尽量保持简单，并与 CommonJS 和 Node.js 的 Modules 规范保持了很大的兼容性。通过 CMD 规范书写的模块，可以很容易在 Node.js 中运行，后续会介绍。