什么是系统
在生活和工作中,我们会接触到大量系统:自然界生态系统、计算机操作系统、软件办公系统,还有教育系统、金融系统、网络系统、理论系统等等。究竟什么是系统呢?
来看下维基百科的解释:
系统泛指由一群有关连的个体组成,根据预先编排好的规则工作,能完成个别元件不能单独完成的工作的群体。系统分为自然系统与人为系统两大类。
简言之,系统有两个基本特性:
- 系统由个体组成。
- 个体之间有关连,按照规则协同完成任务。
系统中的个体可称之为系统成员,这样,要构建一个系统,最基本层面需要做两件事:
- 定义系统成员:确定成员是什么。
- 约定系统通讯:确定成员之间如何交互,遵循的规则是什么。
只要把这两个问题描述清楚,我们就可以构建出系统。
模块系统
Sea.js 是一个适用于 Web 浏览器端的模块加载器。在 Sea.js 里,一切皆是模块,所有模块协同构建成模块系统。Sea.js 首要要解决的是模块系统的基本问题:
- 模块是什么?
- 模块之间如何交互?
在前端开发领域,一个模块,可以是JS 模块,也可以是 CSS 模块,或是 Template 等模块。在 Sea.js 里,我们专注于 JS 模块(其他类型的模块可以转换为 JS 模块):
- 模块是一段 JavaScript 代码,具有统一的基本书写格式。
- 模块之间通过基本交互规则,能彼此引用,协同工作。
把上面两点中提及的基本书写格式和基本交互规则描述清楚,就能构建出一个模块系统。对书写格式和交互规则的详细描述,就是模块定义规范(Module Definition Specification)。
模块标识
模块标识是一个字符串,用来标识模块。在 require
、 require.async
等加载函数中,第一个参数都是模块标识。define
函数的 dependencies
参数也是由模块标识组成。
SeaJS 中的模块标识是 CommonJS 模块标识 的超集:
- 一个模块标识由斜线(
"/"
)分隔的多项组成。- 每一项必须是小驼峰字符串、
"."
或".."
。- 模块标识可以不包含文件后缀名,比如
".js"
。- 模块标识可以是“相对”或“顶级”标识。如果第一项是
"."
或".."
,则该模块标识是相对标识。- 顶级标识根据模块命名空间的根路径来解析。
- 相对标识相对
require
所在模块的标识来解析。
注意,符合上述规范的标识肯定是 SeaJS 的模块标识,但 SeaJS 能识别的模块标识不需要完全符合以上规范。 比如,除了大小写字母组成的小驼峰字符串,SeaJS 的模块标识字符串还可以包含下划线和连字符, 甚至可以以"http://"
、"https://"
、"file:///"
等协议标识开头。
相对标识
相对标识只出现在模块环境中,以 "."
开头。会相对当前模块的 URI 来解析:
// 在 http://example.com/js/a.js 中: require('./b'); // => http://example.com/js/b.js
顶级标识
顶级标识不以点("."
)或斜线("/"
)开始, 会相对 SeaJS 的 base
路径来解析:
// 假设 base 路径是:http://example.com/js/libs/ // 在模块代码里: require('jquery/1.7.1/jquery'); // => http://example.com/js/libs/jquery/1.7.1/jquery.js
base 路径的默认值,与 sea.js 的路径相关: 如果 sea.js 的路径是: http://example.com/js/libs/sea.js 则 base 路径为: http://example.com/js/libs/
当 sea.js
路径中含有版本号时,base
不会包含 seajs/x.y.z
字串。 当类库模块有多个版本时,这样会更方便。
如果 sea.js 的路径是: http://example.com/libs/seajs/1.0.0/sea.js 则 base 路径是: http://example.com/libs/
当然,也可以手工配置 base
路径:
seajs.config({ base: 'http://code.jquery.com/' }); // 在模块代码里: require('jquery'); // => http://code.jquery.com/jquery.js
普通路径
除了相对和顶级标识之外的标识都是普通路径。普通路径的解析规则,和 HTML 代码中的 script.src
一样,会相对当前页面来解析。(以当前页面路径为基础,无论你设置了怎样的base路径)
// 在 http://example.com/js/main.js 中: require('http://example.com/js/a'); // => http://example.com/js/a.js // 在 http://example.com/js/a.js 中: require('/js/b'); // => http://example.com/js/b.js // 在任何代码里: seajs.use('./c'); // => http://example.com/path/to/page/c.js
seajs.use(ids, ...)
和 define(id, ...)
中的模块标识始终是普通路径,因为这两个方法是在全局环境中执行的。
文件后缀的提示
除非在路径中出现井号("#"
)或问号("?"
),SeaJS 在解析模块标识时, 都会自动添加 JS 扩展名(".js"
)。如果不想自动添加扩展名,最简单的方法是, 在路径末尾加上井号("#"
)。
// ".js" 后缀可以省略: require('http://example.com/js/a'); require('http://example.com/js/a.js'); // => http://example.com/js/a.js // ".css" 后缀不可省略: require('http://example.com/css/a.css'); // => http://example.com/css/a.css // 当路径中有问号("?")时,不会自动添加后缀: require('http://example.com/js/a.json?callback=define'); // => http://example.com/js/a.json?callback=define // 当路径以井号("#")结尾时,不会自动添加后缀,且会在解析时,去掉井号: require('http://example.com/js/a.json#'); // => http://example.com/js/a.json
http://seajs.org/docs/#docs