seaJS简介与使用

目录

seaJS简介

快速简要知识点

seajs的使用

使用

语法:seajs.use(id, callback?)


seaJS简介

什么是 seaJS ?
  和requireJS相似的,seaJS 也是用JavaScript编写的JS框架,主要功能是可以按不同的先后依赖关系对 JavaScript 等文件的进行加载工作,可简单理解为JS文件的加载器,它非常适合在浏览器中使用,它可以确保所依赖的JS文件加载完成之后再加载当前的JS文件,这在大量使用JS文件的项目中可确保各个JS文件的先后加载顺序,确保避免了以前因某些原因某个文件加载慢而导致其它加载快的文件需要依赖其某些功能而出现某函数或某变量找不到的问题,这点非常有用,也是 seaJS (遵守CMD) 的主要价值所在吧;但和 requireJS (遵守AMD规范)有所区别。

快速简要知识点

 1、seajs.config({...});   //用来对 Sea.js 进行配置。
2、seajs.use(['a','b'],function(a,b){...});   //用来在页面中加载一个或多个模块。
3、define(function(require, exports, module){...});   //用来定义模块。Sea.js 推崇一个模块一个文件,遵循统一的写法:
4、require(function(require){var a = require("xModule"); ... });   //require 用来获取指定模块的接口。
5、require.async,  //用来在模块内部异步加载一个或多个模块。 例如:

define(function(require){
    require.async(['aModule','bModule'],function(a,b){  // 异步加载多个模块,在加载完成时,执行回调
    a.func();
    b.func();
    })    
});

6、exports, //用来在模块内部对外提供接口。 例如:

define(function(require, exports){
    exports.varName01 = 'varValue';  // 对外提供 varName01 属性    
    exports.funName01 = function(p1,p2){  // 对外提供 funName01 方法
    ....
    }       
});

7、module.exports, 与 exports 类似,用来在模块内部对外提供接口。例如:

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

seajs的使用

使用

seajs.use 用来在页面中加载模块。通过 use 方法,可以在页面中加载任意模块。

<script src="path/to/sea.js"></script>
<script>
seajs.use('./main');
</script>

语法:seajs.use(id, callback?)

// 加载模块 main,并在加载完成时,执行指定回调

seajs.use('./main', function(main) {
main.init();
});

use 方法还可以一次加载多个模块:

// 并发加载模块 a 和模块 b,并在都加载完成时,执行指定回调

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

callback 参数可选。当只加载一个模块,且不需要 callback 时,可以用 data-main 属性来简化:

<script src=”path/to/sea.js” data-main=”./main”></script>

等价于

<script src="path/to/sea.js"></script>
<script>
seajs.use('./main');
</script>

猜你喜欢

转载自blog.csdn.net/weixin_55953988/article/details/123207815