sea.js说明文档

Sea.js 手册与文档

首页 | 索引


目录


模块定义

在 SeaJS 中,所有 JavaScript 文件都应该用模块的形式来书写,并且一个文件只包含一个模块。

define

使用全局函数 define 来定义模块:

define(id?, dependencies?, factory);

id

当前模块的唯一标识。该参数可选。如果没有指定,默认为模块所在文件的访问路径。如果指定的话, 必须是顶级或绝对标识(不能是相对标识)。

dependencies

当前模块所依赖的模块,是一个由模块标识组成的数组。该参数可选。如果没有指定,模块加载器会从factory.toString() 中解析出该数组。

** 注意:强烈推荐不要设定 id 和 dependencies 参数。 在开发阶段,模块加载器会自动获取这两个参数。部署上线时,则可以通过优化工具来提取这两个参数。

factory

模块的工厂函数。模块初始化时,会调用且仅调用一次该工厂函数。factory 可以是函数, 也可以是对象、字符串等任意值,这时 module.exports 会直接设置为 factory 值。

factory 函数在调用时,会始终传入三个参数: requireexports 和 module, 这三个参数在所有模块代码里可用。

define(function(require, exports, module) {

  // The module code goes here

});

exports

exports 用来向外提供模块的 API.

define(function(require, exports) {
  // snip...
  exports.foo = ‘bar‘;
  exports.doSomething = function() {};
});

除了给 exports 对象增加成员,还可以使用 return 直接向外提供 API.

define(function(require, exports) {
  // snip...
  return {
    foo: ‘bar‘,
    doSomething: function() {};
  };
});

如果 return 语句是模块中的唯一代码,可简化为:

define({
  foo: ‘bar‘,
  doSomething: function() {};
});

上面这种格式特别适合定义 JSON 数据。

** 注意:下面这种写法是错误的!

define(function(require, exports) {
  // snip...
  exports = { // 错误!
    foo: ‘bar‘,
    doSomething: function() {};
  };
});

模块加载器不能获取到新赋给 exports 变量的值。 请使用 return 或 module.exports 。

require

require 函数用来访问其他模块提供的 API.

define(function(require) {
  var a = require(‘./a‘);
  a.doSomething();
});

它接受 模块标识 作为唯一参数。

请牢记,为了使静态分析能成功获取到模块依赖信息,在书写模块时,需要遵循一些简单的 规则

require.async

该方法可用来异步加载模块,并在加载完成后执行回调函数。

define(function(require, exports, module) {
  // 加载一个模块
  require.async(‘./b‘, function(b) {
    b.doSomething();
  });

  // 加载多个模块
  require.async([‘./c‘, ‘./d‘], function(c, d) {
    // do something
  });
});

require.resolve

使用 require() 的内部机制来解析并返回模块路径。该函数不会加载模块,只返回解析后的路径。

require.load

该方法可用来异步加载脚本,并在加载完成后,执行指定的回调函数。开发插件时, 可以通过覆盖该方法来实现自定义的资源加载。

require.constructor

有时候,我们需要给所有 require 参数对象添加一些公用属性或方法。这时, 使用 require.constructor 来实现会非常方便。

module

module 参数存储模块的元信息。拥有以下成员:

module.id

当前模块的唯一标识。 require(module.id) 必然返回此模块的 exports 。

define(function(require, exports, module) {
  console.log(module.id); // http://path/to/this/file.js
  console.log(require(module.id) === exports); // true
});

module.dependencies

module.dependencies 是一个数组,表示当前模块的依赖列表。

该数组只读:模块加载完成后,修改该数组不会有任何效果。

module.exports

exports 对象由模块系统创建,这不能满足开发者的所有需求, 有时候会希望 exports 是某个类的实例。 这时可用 module.exports 来实现:

define(function(require, exports, module) {
  console.log(module.exports === exports); // true
  module.exports = new SomeClass();
  console.log(module.exports === exports); // false
});

注意,对 module.exports 的赋值需要同步执行,它不能放在回调函数里。 下面这样是不行的:

x.js:

define(function(require, exports, module) {
  setTimeout(function() {
    module.exports = { a: "hello" };
  }, 0);
});

y.js:

define(function(require, exports, module) {
  var x = require(‘./x‘);
  console.log(x.a); // undefined
});

module.constructor

有时候,我们需要给所有 module 参数对象添加一些公用属性或方法。在这种情况下, 使用module.constructor 可以很好地满足需求。

extend.js:

define(function(require, exports, module) {
  var Module = module.constructor;

  Module.prototype.filename = function() {
    var id = this.id;
    var parts = id.split(‘/‘);
    return parts[parts.length - 1];
  };
});

a.js:

define(function(require, exports, module) {
  exports.filename = module.filename();
});
时间: 2024-09-29 00:53:56

sea.js说明文档的相关文章

Sea.js 手册与文档

Sea.js 手册与文档 首页 | 索引 目录 何为 CommonJS 何为 CommonJS 模块 为何封装模块 何为 CommonJS? CommonJS 是一个有志于构建 JavaScript 生态圈的组织.它有一个 邮件列表,有很多开发者参与其中. 整个社区致力于提高 JavaScript 程序的可移植性和可交换性,无论是在服务端还是浏览器端. 何为 CommonJS 模块? JavaScript 并没有内置模块系统(反正现在没有),于是 CommonJS 创造了自己的. 传统的 Com

CMD (sea.js)模块定义规范

转自http://www.cnblogs.com/hongchenok/p/3685677.html CMD 模块定义规范 在 Sea.js 中,所有 JavaScript 模块都遵循 CMD(Common Module Definition) 模块定义规范.该规范明确了模块的基本书写格式和基本交互规则. 在 CMD 规范中,一个模块就是一个文件.代码的书写格式如下: define(factory); define Function define 是一个全局函数,用来定义模块. define d

JS中的模块化开发之Sea.JS

模块化开发的好处: 1:减少冲突 2:提高性能 用sea.js为例:sea.js模块库下载地址:http://seajs.org/docs/#downloads 例子:获取非行间样式的模块化开发: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="

Seajs是什么及sea.js 由来,特点以及优势

Seajs是什么及sea.js 由来,特点以及优势 这篇文章主要介绍了Seajs的相关知识和和学习心得,适合刚接触SeaJS的同学,需要的朋友可以参考下,有更好的新手教程或文档,欢迎推荐.分享 1.Seajs简介 Seajs,一个Web模块加载框架,追求简单.自然的代码书写和组织方式,:Sea.js 遵循 CMD 规范,模块化JS代码.依赖的自动加载.配置的简洁清晰,可以让程序员更多地专注编码. 2.Seajs优缺点 优点: 1).提高可维护性. 2).模块化编程. 3).动态加载,前端性能优化

说明文档编写过程

项目需要做一个说明文档来介绍公司软件,在网上参考了很多文档的写法,也问过很多朋友之类的,最后自己慢慢的把这个文档完成了.本文只是为了把它记录下来,为以后需要在做这块提供借鉴. 设计图如下: header 部分和目录是 fixed 定位,目录的 html 结构如下: <ul id="directory"> <li id="onfirst" class="on">一.关于Auto-Trader Pro</li> &

js模板加载框架 sea.js学习笔记

seajs实现了JavaScript 的 模块开发及按模块加载.用来解决繁琐的js命名冲突,文件依赖等问题,其主要目的是令JavaScript开发模块化并可以轻松愉悦进行加载. 官方文档:http://seajs.org/docs/#docs 首先看看seajs是怎么进行模块开发的.使用seajs基本上只有一个函数“define” fn.define = function(id, deps, factory) { //code of function… } 使用define函数来进行定义一个模块

Lodop6 以上打印控件使用,详参考自带说明文档,打印样式及文字大小要特殊设置一下

<link href="../css/cssprint.css" rel="stylesheet" /> <script src="../Lodop/LodopFuncs.js"></script> <style id="style1"> table { font-size: 9pt; font-weight: normal; color: #000000 ; text-deco

模块化开发之sea.js实现原理总结

seajs官网说:seajs是一个模块加载器,所以学习它并不难. 在我的理解就是:本来我们是需要手动创建 script标签 引入 js文件的,但用seajs后,它就自动帮我们完成这些工作. 这里只说实现原理,具体使用请看seajs官网:http://seajs.org/docs/ 下面总结一下: 1. sea.js 是怎样解决 模块加载(这里说的模块其实就是js文件加载), 2. sea.js 是怎样解决 模块依赖 3. sea.js 是怎样解决 命名冲突 1.模块加载 其实,原理很简单,和手动

记录:sea.js和require.js配置 与 性能对比

最近有点忙,很久无写博客,记录一下之前的配置require.js和sea.js的配置.(有误有望提出 require.js 文件目录 /app(项目使用js) /lib(require.js jq存放处) /plugin(框架对应的功能插件) require.js比较方便在于,不是amd的模块组件可以通过配置文件进行依赖配置.而且异步加载js 页面加载速度是杠杠的.当然会有点问题的,网速过慢的话,可能会出现js,timeout(可以通过配置解决. config.js (配置文件) // 配置信息