sea.js详解

Seajs相关知识

seajs.Use 引入入口文件

第一个参数表示模块id

字符串表示一个模块id

数组，数组每个成员表示一个模块

第二个参数表示回调函数（可有可无的）

作用就是当模块加载完成执行回调函数

作用域是全局作用域

参数与前面加载的模块是一致的

Use方法返回值是seajs对象，因此可以链式调用

Seajs默认根目录是seajs文件所在的目录，因此我们通常要将seajs文件放在最外面

文件只需要引入seajs文件，其他的是要通过seajs引入的

通常来说入口文件只有一个，所以链式调用时候，很少见，在一个use方法回调函数内部不能知道其他use方法什么时候加载完毕

Define 定义模块的，根据传递的参数我们分成三类

第一类 传递一个参数

如果是一个值类型的数据，那么这个数据直接作为接口暴漏出来

如果是一个对象，那么这个对象就是暴漏的接口

如果是一个函数（最常见的一种方式，它符合commonjs规范），

作用域是全局作用域

参数有三个

Require 加载模块的

Exports 定义接口的

Module 模块的对象

第二类 传递两个参数

第一个参数

如果是字符串 表示模块的id

如果是数组 表示模块的依赖集合

此时不论模块有没有使用该模块都会去加载它，并且不会去解析模块内部require方法

第二个参数表示模块函数（对象等其他数据）这个函数的使用方式跟上面函数式一致的

第三类 传递三个参数

第一个参数 是字符串，表示模块id

第二个参数 是数组，表示依赖集合

第三个参数 函数（其他数据），模块函数，函数的使用方式跟上面的函数式一致

通常来说一个文件只能添加一个模块（模块没有定义id），如果定义了多个模块，后面的覆盖前面的

如果模块定义了id，此时这些模块是兼容的，引用这些模块的时候，一定要通过这些id引用

Require加载模块

1 不能简写，在模块函数的参数中

2 不能修改

不能赋值

不能定义变量

不能作为函数参数

在子函数中不能修改

3 使用时不能使用表达式

当我们定义模块id时候，此时我们不能直接引入该模块

想使用模块要分成两步

第一步 在依赖模块集合中引入该模块

第二步 在模块内部用require引入模块id

接口exports 包含commonjs规范定义接口的语法

1 exports.接口

可以继续添加接口

2 module.exports.接口

可以继续添加接口，并且1和2是可以混用的

3 module.exports = {}

定义全部的接口，不能在使用前面两种定义接口方式

4 return {}

定义全部的接口，此时会将前面所有接口覆盖掉

5 return function () {}

定义接口函数，使用时候，必须调用它

6 module.exports = function () {}

定义接口函数

7 define(值类型)

定义一个值类型的数据接口

8 module.exports = 值类型

定义一个值类型的数据接口

9 return 值类型

定义一个值类型的数据接口

10 define({})

定义一个对象接口

注意

定义接口的优先级

Return  > module.exports = {}或者function > module.exports.接口 或者exports.接口

Exports绝对不能赋值对象 exports = {}

定义接口函数时候，有两种方式

第一种

Return function 或者module.exports = function

第二种

Var demo = function () {}或者function demo (){}

Return demo 或者module.exports = demo

模块module

Id 表示模块的id，如果定义模块没有添加id的时候，模块的id就是uri

Uri表示模块所在文件的地址

Exports表示模块暴漏的接口

Status 模块的状态

Dependencies 依赖的模块，是一个数组 每个成员表示一个模块的id

Deps 依赖的模块，是个对象，对象属性表示模块的id，对象属性值表示模块的信息对象

异步加载模块 require.async

与use方法很像，只不过一个在模块外部使用，一个在模块内部使用

与require的区别，require遵守commonjs规范是同步加载的，require.async是异步加载的

Require引入就可以使用

Require.async 在引入后，的回调函数中才能使用，函数返回值就是require对象

在if语句中

如果条件成立

Require会加载并执行该模块

Require.async 会一步加载模块，并执行

如果条件不成立

Require会加载模块，但不会执行

Require.async 不会加载模块，也不会执行

在异步操作中

例如在定时器中

Require会立即加载文件，但是等到定时器执行的时候才会执行模块函数

Require.async 会等到异步操作执行的时候，加载并执行模块

配置config

配置是seajs为我们提供的功能，但是我们想使用就要配置这些信息

Alias 创建模块的别名

作用简化对模块的引用

值是一个对象

对象的属性名称表示别名

对象的属性值表示真实路径

Path 定义路径

作用 简化对模块路径书写

值是一个对象

Key表示简化的路径

Value表示真实的路径

Map 定义模块映射关系的

批处理模块的

值是一个二维数组

数组的每个成员表示一组映射规则，每个映射规则是一个数组

第一个成员表示匹配的规则

第二个成员表示处理的规则

Debug 进入调试模块，可以看到js加载过程

Vars 定义路径模板变量

作用可以是引入的模块动态会

模板语法 {}, 在路径的{}中我们可以使用vars中定义的变量

值是一个对象

Key 表示变量

Value表示变量的值

Charset 定义js文件加载时候的编码格式，

Base 定义模块的根路径，它的值是个字符串，此时根路径就是个字符串指向的目录，此时seajs文件可以随意的防止了

Seajs插件

我们需要的功能，seajs没有帮我们实现，别人帮我们了，我们使用别人提供的代码，这些代码就是插件，我们使用这些插件就要去加载这些插件文件

在seajs中使用插件，一定要写在seajs标签后面（插件依赖于seajs），对于一些插件是需要写配置的，例如预加载插件

预加载插件

在模块加载过程中有限加载某些文件（通常这些文件都是一些代码工具库，或者框架）

这些文件的特征是，都会提供一个全局变量方便我们使用它

这个插件的作用

1 我们不用在每一个模块内显性的引入它，而可以直接使用他们（因为他们提供了全局变量）

2 我们不需要修改这些文件的源代码，因为他们提供全局变量

3 在更新代码库的时候成本低，我们只需要更改配置就可以了，因为每个版本提供的全局变量的，

预加载插件加载时间（让我们知道，我们什么时候可以使用这些预加载的库）

在调用use方法之后，模块加载之前开始加载这些库的

所以配置项要写在use方法之前（所有的配置都要写在use方法之前，或者整个项目的最前面）

在配置中，我们通过preload属性加载库

Preload是一个数组，每一个成员代编一个文件

1

Css插件

到目前为止，我们学的加载文件都是加载的js文件，有时我们在工作中开发项目时候，我们写的不仅仅是js，还有css，此时如果对于一个搜索框，我们通常将他们的js与css写在一起，此时如果js是一个模块化开发文件，我们通常需要将css引入进来，这样就会是css与js产生依赖。使他们形成一个整体

使用css插件就要加载seajs-css文件

使用方式：

第一步在seajs标签后面引入该文件标签

第二步，哪个js模块需要什么css文件就通过require引入它

注意引入的css文件一定要加上.css后缀名

Use方法不仅仅可以引入js文件，还可以引入css文件，所以对于一些在渲染之前就要加载的css文件我们可以写在这里

来自为知笔记(Wiz)