作者:zccst
在 CMD 规范中,一个模块就是一个文件。代码的书写格式如下:
define(factory);
define Function
define 是一个全局函数,用来定义模块。
define define(factory)
define 接受 factory 参数,factory 可以是一个函数,也可以是一个对象或字符串。
factory 为对象、字符串时,表示模块的接口就是该对象、字符串。比如可以如下定义一个 JSON 数据模块:
define({ "foo": "bar" });
也可以通过字符串定义模板模块:
define('I am a template. My name is {{name}}.');
factory 为函数时,表示是模块的构造方法。执行该构造方法,可以得到模块向外提供的接口。factory 方法在执行时,默认会传入三个参数:require、exports 和 module:
define(function(require, exports, module) {
// 模块代码
});
define define(id?, deps?, factory)
define 也可以接受两个以上参数。字符串 id 表示模块标识,数组 deps 是模块依赖。比如:
define('hello', ['jquery'], function(require, exports, module) {
// 模块代码
});
id 和 deps 参数可以省略。省略时,可以通过构建工具自动生成。
注意:带 id 和 deps 参数的 define 用法不属于 CMD 规范,而属于 Modules/Transport 规范。
define.cmd Object
一个空对象,可用来判定当前页面是否有 CMD 模块加载器:
if (typeof define === "function" && define.cmd) {
// 有 Sea.js 等 CMD 模块加载器存在
}
1,require
require(id);
require.async(id, callback);异步加载
require.resolve(id);不加载模块,仅仅将短串解析成完整路径
2,exports 是一对象,用来向外提供模块接口
define(function(require, exports){
exports.foo = "bar";
exports.doSomethin = function(){};
});
还可以通过return对外提供接口
define(function(require, exports){
return {
foo : "bar";
exports.doSomethin : function(){};
};
});
还可以写成module.exports
define(function(require, exports){
module.exports = {
foo : "bar";
exports.doSomethin : function(){};
};
});
提示:exports 仅仅是 module.exports 的一个引用。在 factory 内部给 exports 重新赋值时,并不会改变 module.exports 的值。因此给 exports 赋值是无效的,不能用来更改模块接口。
3,module 是一个对象,存储了与当前模块相关联的一些属性和方法
module.id String
模块的唯一标识。
define('id', [], function(require, exports, module) {
// 模块代码
});
上面代码中,define 的第一个参数就是模块标识。
module.uri String
根据模块系统的路径解析规则得到的模块绝对路径。
define(function(require, exports, module) {
console.log(module.uri);
// ==> http://example.com/path/to/this/file.js
});
一般情况下(没有在 define 中手写 id 参数时),module.id 的值就是 module.uri,两者完全相同。
module.dependencies Array
dependencies 是一个数组,表示当前模块的依赖。
module.exports Object
当前模块对外提供的接口。
传给 factory 构造方法的 exports 参数是 module.exports 对象的一个引用。只通过 exports 参数来提供接口,有时无法满足开发者的所有需求。 比如当模块的接口是某个类的实例时,需要通过 module.exports 来实现:
define(function(require, exports, module) {
// exports 是 module.exports 的一个引用
console.log(module.exports === exports); // true
// 重新给 module.exports 赋值
module.exports = new SomeClass();
// exports 不再等于 module.exports
console.log(module.exports === exports); // false
});
注意:对 module.exports 的赋值需要同步执行,不能放在回调函数里。下面这样是不行的:
// x.js
define(function(require, exports, module) {
// 错误用法
setTimeout(function() {
module.exports = { a: "hello" };
}, 0);
});
在 y.js 里有调用到上面的 x.js:
// y.js
define(function(require, exports, module) {
var x = require('./x');
// 无法立刻得到模块 x 的属性 a
console.log(x.a); // undefined
});
分享到:
相关推荐
CMD规范之Seajs Seajs是一款轻量级的前端模块加载器,它遵循CommonJS规范,使得JavaScript在浏览器端也能实现模块化的开发。这个规范主要包含模块定义、模块加载和模块化开发的思想,大大提高了代码的可维护性和...
本话题将深入探讨如何将现有的JavaScript库改写为符合CMD规范的模块,以便更好地在项目中利用和管理这些库。 CMD规范的核心思想是延迟执行和按需加载。它允许开发者在脚本中使用`define`函数来定义模块,并通过`...
1. **模块合并**:能够根据CMD规范,自动解析并合并多个模块文件为一个单一的文件,减少网络请求,提高页面加载速度。 2. **异步调用支持**:支持异步调用模块合并,这意味着在处理大型项目或者有动态依赖时,可以...
CMD规范的核心思想是“按需加载”,在CMD中,模块的定义、依赖和加载可以按需进行,可以在任何时刻去加载一个模块,而无需在定义的时候就指定依赖。这使得CMD在某些方面比AMD更加灵活。CMD的define函数不仅定义了...
HaloJS的组件化设计是遵循CMD规范的,CMD是Sea.js推广的一种模块化开发方式,它推崇的是延迟执行和依赖注入,这使得代码组织更加清晰,易于维护和扩展。在CMD规范下,每个模块都可以独立开发,减少了模块间的耦合度...
sea.js遵循CMD规范,用于实现js在浏览器端的模块化开发。 sea.js中只有局部require。
- **依赖延迟加载**: 在CMD规范中,只有当真正需要依赖时才会去加载它,这与AMD规范有所不同。 示例: ```javascript // 使用 Sea.js 实现 CMD 规范 define(function(require, exports, module) { var dep1 = ...
CMD_DEMO.zip是一个压缩包,其中包含了CMD规范的示例DEMO。CMD,全称Command Prompt,是Windows操作系统中的命令行界面,用户可以通过输入特定的命令来执行各种系统操作。这个压缩包很可能是为了帮助用户理解和学习...
CMD规范的主要特点包括: - CMD同样使用`define()`函数定义模块。 - 模块可以按需加载,即只加载实际需要的部分。 - 支持模块的动态加载,使得代码更为灵活。 CMD的一个示例: ```javascript define(function...
- **简介**:CMD规范是由中国淘宝团队提出的一种模块化规范,主要用于前端开发中,特别是在大型项目中表现出了良好的性能优势。 - **特点**: - 异步加载模块。 - 支持延迟加载和动态加载,即按需加载。 - 采用...
Sea.js是CMD规范的主要实现,其模块定义使用`seajs.use`或`define`方法。CMD的依赖注入是延迟的,只有在运行到某个模块时才会解析其依赖。例如: ```javascript define(function(require, exports, module) { var ...
**Cmd**(Common Module Definition)是 Sea.js 提出的一种模块化规范,类似于 AMD(Asynchronous Module Definition)规范,但更注重代码的自然书写顺序。Cmd 支持动态加载模块,使得模块化开发更加灵活。Gulp-cmd-...
2. **模块化处理**:支持CMD规范,使得你的代码可以以模块化的方式组织,便于管理和复用。 3. **压缩合并**:将多个JavaScript文件合并成一个文件,减少HTTP请求,同时进行压缩,降低文件大小,提高页面加载速度。 4...
CMD是JavaScript模块化开发的一种规范,尤其在中国社区广泛使用,如Sea.js等模块加载器就是基于CMD规范。CMD强调的是就近依赖,即在需要使用某个模块的地方直接require,而不是预先全局定义。 首先,理解`...
当Vue.js项目需要与AMD或CMD规范配合时,例如在一个已经采用RequireJS或Sea.js的大型项目中,Vue文件需要经过特定的编译过程才能适配这两种模块化系统。这个过程通常涉及预处理器或者构建工具,如Webpack、Rollup或...
同时还有CMD规范,为同步加载方案如seaJS。 ES6在语言规格的层面上,实现了模块功能,而且实现得相当简单,完全可以取代现有的CommonJS和AMD规范,成为浏览器和服务器通用的模块解决方案。 ES6模块主要有两个功能:...
CommonJS规范的同步加载适合服务器端场景,AMD和CMD规范的异步加载更适合浏览器端。而在实际开发中,开发者需要根据项目的具体需求和环境选择合适的模块化规范。例如,在开发Node.js应用时,会优先考虑CommonJS规范...