seajs是我刚入门前端就接触到的一个javaScript模块加载框架。使用seajs后javaScript代码的可读性和清晰度有了很大的提高,插件的使用和组装变的很方便。更加方便代码的升级和维护。推荐使用插件比较多的项目使用。或者使用requirejs也比较流行。javascript
ps:若是想知道RequireJS、SeaJS哪一个好用的能够自行对比,或者查看html
首先先去官网下载最新版本。
下载后,假定把它放在js子目录下面,就能够加载了。前端
<script type="text/javascript" src="js/sea.js"></script>
加载seajs后咱们还须要加载本身的js配置文件java
<script type="text/javascript" src="js/sea-config.js"></script>
seajs 的简单配置jquery
//.sea-config.js seajs.config({ base: "../plug-js/", alias: { "jquery": "jquery/1.10.1/jquery.js" } })
简单使用api
// 全部模块都经过define来定义 define(function(require,exports,module){ // 经过require来引入jquery var $ = require('jquery'); console.log($); })
使用全局函数define来定义函数数组
define(id?,dependencies?,factory);
id: 当前模块的惟一标识。该参数可选。若是没有指定,默认为模块所在文件的访问路径。若是指定的话,必须是顶级或绝对标识。
dependencies: 当前模块所依赖的模块,是一个由模块标识组成的数组。
factory: 模块的工做函数。模块初始化时,会调用且仅调用一次该工厂函数。框架
define(function(require,exports,module){ //The module code goes here })
**注意:不推荐不要设定id和dependencies参数。异步
exports 用来向外提供模块的APIasync
define(function(require,exports){ // snip exports.foo = 'bar'; exports.doSomething = function(){}; })
除了给exports对象增长成员,还能够使用return直接向外提供API
define(function(require,exports){ // snip... return { foo : 'bar', doSomething : function(){} } }) 可简化为: define({ foo : 'bar', doSomething : function(){} })
require函数用来访问其余模块提供的API
define(function(require){ var a = require('./a'); a.doSomething(); })
require.async: 异步加载模块,并在加载完成后执行回调函数
require.resolv: 使用require()的内部机制来解析并返回模块路径。该函数不会加载模块,只返回解析后的路径。
require.load: 该方法可用异步加载脚本,并在加载完成后,执行指定的回调函数。
require.constructor: 给全部require参数对象添加一些公用属性或方法。
modeule 参数存储模块的元信息
module.id: 当前模块的惟一标识。
module.dependencies: 表示当前模块的依赖列表
module.exports: exports是某个类的实例
define(function(require,exports,module){ console.log(module.exports === exports); // true module.exports = new SomeClass(); console.log(module.exports === exports); // false })
module.constructor: 给module参数对象添加一些公用属性或方法。