一、概念：
SeaJS是一个遵循CommonJS规范的JavaScript模块加载框架。
在 Sea.js 中，所有 JavaScript 模块都遵循 CMD（Common Module Definition） 模块定义规范。该规范明确了模块的基本书写格式和基本交互规则。
在 CMD 规范中，一个模块就是一个文件。代码的书写格式如下：define(factory);
SeaJS解决了两个问题：
1.JavaScript的模块化
2.按模块加载
SeaJS在开发中的角色：在多人协作开发时，起着后勤人员的作用，协调 文件依赖、命名冲突、按需加载的作用;
二、用法：
1.引入sea.js
2.定义模块--define
3.对外提供接口--export
4.依赖接口--require
5.调用模块--seajs.use
例：
为了让 sea.js 内部能快速获取到自身路径，推荐手动加上 id 属性
1 <!DOCTYPE html>
2 <html xmlns="http://www.w3.org/1999/xhtml">
3 <head>
4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
5 <title>seajs的使用方法</title>
6 <script type="text/javascript" src="sea/sea.js" id="seajs"></script>
7 <script>
8 /*
9 调用模块
10 语法：
11 seajs.use(url, callback);
12 参数说明：
13 url: 调用模块的地址, url默认根目录是sea.js所有文件夹
14 callback: 回调函数
15 内部工作原理：
16 填入url后，seajs会异步加载url的文件， 加载完成后执行 callback;
17 这样就实现了按模块加载JS，也可以说是按需加载。
18 */
19 seajs.use(‘./js/test1.js‘,function(ex){
20
21 //ex就是对外接口export
22 ex.tab();
23
24 function tab(){
25 alert(‘我是现写的，大家都是tab，但不冲突哦~~‘);
26 }
27
28 tab(); //很好的就解决了命名冲突
29
30 });
31
32 </script>
33 </head>
34
35 <body>
36 </body>
37 </html>
目录层级关系如下 ：
test1.js 如下：
1 // JavaScript Document
2 /*
3 定义模块
4 语法：
5 define(function (require, exports, module){ //参数写法是固定
6 //your code gose here
7 });
8 参数说明：
9 require: 依赖的接口
10 exports: 对外提供的接口
11 module:
12 内部工作原理：
13 1.当调用require方法时，seajs会同步加载url的文件，这样就解决依赖问题了。如果想异步加载就用require.async(url, callback);
14 2.exports对象下包含的是对外提供的属性和方法，调用seajs.use时，callback函数的参数就是exports对象
15 */
16 define(function(require, exports, module){
17
18 //如果依赖的是一个普通JS文件
19 require(‘./test2.js‘);
20
21 //如果依赖的是一个用define写的JS模块
22 var ex = require(‘./test3.js‘);
23
24 function tab(){
25 alert(‘我是test1模块的一个方法‘);
26 alert(‘test1‘ + a);
27 alert(‘test1‘ + ex.b)
28 }
29
30 exports.tab = tab;
31
32 });
test2.js 如下：
1 // JavaScript Document 2 3 var a = ‘依赖test2了， 我是test2的全局变量‘;
test3.js 如下：
1 // JavaScript Document
2
3 define(function(require,exports,module){ //参数写法是固定
4
5 exports.b = ‘依赖test3了，我是test3模块的局部变量‘;
6
7 });
上面说到了seajs中常用的4个方法，别外请参考管方的seajs常用的7个方法： https://github.com/seajs/seajs/issues/266
模块化开发，SesJS简单总结
时间： 2024-10-12 21:03:00