seajs学习笔记

1、使用SeaJS开发JavaScript的基本原则就是：一切皆为模块。引入SeaJS后，编写JavaScript代码就变成了编写一个又一个模块，SeaJS中模块的概念有点相似于面向对象中的类——模块能够拥有数据和方法，数据和方法能够定义为公共或私有，公共数据和方法能够供别的模块调用。
每一个模块应该都定义在一个单独js文件中，即一个对应一个模块。

2、模块的定义和编写

fn.define = function(id, deps, factory) {
    //code of function…
}

若是只有一个参数，则赋值给factory。

若是有两个参数，第二个赋值给factory；第一个若是是array则赋值给deps，不然赋值给id。

若是有三个参数，则分别赋值给id，deps和factory。

可是，包括SeaJS的官方示例在内几乎全部用到define的地方都只传递一个工厂函数进去，相似与以下代码：

define(function(require, exports, module) {
    //code of the module...
});

id是一个模块的标识字符串，define只有一个参数时，id会被默认赋值为此js文件的绝对路径。

没有特别的必要建议不要传入id。deps通常也不须要传入，须要用到的模块用require加载便可。

3、工厂函数
三个参数：

1. require——模块加载函数，用于记载依赖模块。
2. exports——接口点，将数据或方法定义在其上则将其暴露给外部调用。
3. module——模块的元数据。

下面说一下module。module是一个对象，存储了模块的元信息，具体以下：

1. module.id——模块的ID。
2. module.dependencies——一个数组，存储了此模块依赖的全部模块的ID列表。
3. module.exports——与exports指向同一个对象

4、三种编写模块的模式

第一种定义模块的模式是基于exports的模式：

是一种比较“正宗”的模块定义模式。除了将公共数据和方法附加在exports上，也能够直接返回一个对象表示模块

define(function(require, exports, module) {
    var a = require('a'); //引入a模块
    var b = require('b'); //引入b模块
 
    var data1 = 1; //私有数据
 
    var func1 = function() { //私有方法
        return a.run(data1);
    }
 
    exports.data2 = 2; //公共数据
 
    exports.func2 = function() { //公共方法
        return 'hello';
    }
});

第二种：和上面的模式功能相同

define(function(require) {
    var a = require('a'); //引入a模块
    var b = require('b'); //引入b模块
 
    var data1 = 1; //私有数据
 
    var func1 = function() { //私有方法
        return a.run(data1);
    }
 
    return {
        data2: 2,
        func2: function() {
            return 'hello';
        }
    };
});

第三种：若是模块定义没有其它代码，只返回一个对象，还能够有以下简化写法：对于定义纯JSON数据的模块很是合适。

define({
    data: 1,
    func: function() {
        return 'hello';
    }
});

5、模块的载入和引用

上文说过一个模块对应一个js文件，而载入模块时通常都是提供一个字符串参数告诉载入函数须要的模块，因此就须要有一套从字符串标识到实际模块所在文件路径的解析算法。

根据应用场景的不一样，SeaJS提供了三个载入模块的API，分别是seajs.use，require和require.async

1.seajs.use

seajs.use主要用于载入入口模块。

//单一模式
seajs.use('./a');
 
//回调模式
seajs.use('./a', function(a) {
  a.run();
});
 
//多模块模式
seajs.use(['./a', './b'], function(a, b) {
  a.run();
  b.run();
});

SeaJS会顺着入口模块解析全部依赖模块并将它们加载。若是入口模块只有一个，也能够经过给引入sea.js的script标签加入”data-main”属性来省略seajs.use

<script src="./sea.js" data-main="./init"></script>

2.require

require是SeaJS主要的模块加载方法，当在一个模块中须要用到其它模块时通常用require加载：

SeaJS的自动加载机制。上文说过，使用SeaJS后html只要包含sea.js便可，那么其它js文件是如何加载进来的呢？SeaJS会首先下载入口模块，而后顺着入口模块使用正则表达式匹配代码中全部的require，再根据require中的文件路径标识下载相应的js文件，对下载来的js文件再迭代进行相似操做。整个过程相似图的遍历操做（由于可能存在交叉循环依赖因此整个依赖数据结构是一个图而不是树）。

传给require的路径标识必须是字符串字面量，不能是表达式，以下面使用require的方法是错误的：

3.require.async

SeaJS会在html页面打开时经过静态分析一次性记载全部须要的js文件，若是想要某个js文件在用到时才下载，可使用require.async：

require.async('/path/to/module/file', function(m) {
    //code of callback...
});

 

6、seajs全局配置

SeaJS提供了一个seajs.config方法能够设置全局配置，接收一个表示全局配置的配置对象。具体使用方法以下：

seajs.config({
    base: 'path/to/jslib/',
    alias: {
      'app': 'path/to/app/'
    },
    charset: 'utf-8',
    timeout: 20000,
    debug: false
});

其中base表示基址寻址时的基址路径

alias能够对较长的经常使用路径设置缩写。

charset表示下载js时script标签的charset属性。

timeout表示下载文件的最大时长，以毫秒为单位。

debug表示是否工做在调试模式下。