- 浏览: 2566703 次
- 性别:
- 来自: 北京
文章分类
- 全部博客 (1286)
- js-oop (2)
- js-window (10)
- js-event (19)
- js-string (37)
- js-array (27)
- js-page (4)
- js-dom (62)
- js-lang (8)
- js-number (7)
- js-platform (3)
- js-object (15)
- js-element (3)
- js-browser (7)
- js-url (6)
- js-date (10)
- css基础 (48)
- css优化 (15)
- html基础 (17)
- html标签 (19)
- js基础 (117)
- js-兼容性差异 (33)
- js引擎 (3)
- js性能 (14)
- json (6)
- jQuery源码浅析 (43)
- web mobile开发资料 (78)
- js跨域 (2)
- html5 (74)
- html5-canvas (7)
- css3 (53)
- 浏览器 (5)
- api设计学 (3)
- js-加载 (3)
- linux (37)
- 架构师 (1)
- php (2)
- self开发的脚本库--凤凰 (2)
- web应用名词 (6)
- javascript新特性翻译 (8)
- ajax (6)
- jQuery动画效果 (7)
- prototype的解读 (13)
- 优秀插件翻译 (1)
- css解决方案 (26)
- 数据库 (2)
- english daily (59)
- 浏览器内核探究 (1)
- jQuery插件介绍 (9)
- jquery基础篇 (26)
- chrome浏览器问题整理 (14)
- js选择器那些事 (3)
- 前端框架 (26)
- Firefox私有属性 (11)
- webkit私有属性集合 (17)
- 书籍推荐 (21)
- 数据结构 (1)
- 网站建设相关 (7)
- 好文翻译 (2)
- 个人作品 (3)
- kissy的解读 (4)
- css-layout(布局研究) (5)
- less研究 (1)
- YUI探究 (1)
- hash探究 (1)
- js动画 (7)
- 前端面试题 (37)
- css书写规范 (1)
- js模板引擎 (6)
- js模块化 (19)
- 编写高质量代码 (3)
- 性能探究--应用协议 (2)
- 前端图像处理 (19)
- Mac OS相关 (21)
- 正则表达式 (11)
- 离线应用相关 (0)
- 前端工具 (65)
- nodeJS (55)
- jquery优化篇 (2)
- 设计模式探究系列 (3)
- windows7 (2)
- IE10 (10)
- 微博开放平台探究 (2)
- 常用web服务接口 (1)
- 数据存储相关 (8)
- 零时文件 (2)
- jQuery Mobile (16)
- backbone (15)
- underscore (22)
- sass (11)
- android (3)
- phonegap (10)
- IE私有 (11)
- qwrap (8)
- git (14)
- chrome extensions (5)
- freemarker (11)
- angularJS (3)
- seo (2)
- markdown (3)
- css动画 (4)
- 安卓开发 (2)
- React (7)
- 活动页技术 (1)
- 网络安全 (3)
- grunt (7)
- Lo-Dash (3)
- 前端国际化 (4)
- 版本控制 (2)
- 盒模型 (4)
- 微信开发 (1)
- Mock数据工具 (1)
- sails (1)
- vim (1)
- js-color (1)
- iOS 基础 (43)
最新评论
-
jertom:
<div id="showInfo" ...
addEventListener等事件监听的参数细谈 -
乌托邦国王:
引用[u][/u]
css3动画属性系列之transform细讲移动translate -
hvang1988:
能提供附件下载吗,找不到js库,google封了访问不了
Syntaxhighlighter---代码高亮插件介绍 -
sscsacdsadcsd:
我的天 那到底是为什么function是object我看und ...
typeof func ==='function'的疑惑 -
wkjiangwk:
试了,没用,你们从不去测试。
介绍一下x-webkit-speech -------实现语音输入
前面介绍了一下AMD相关的东西,这篇我们来看看CMD相关的。
CMD ------- Common Module Definition
在CMD规范里面,一个模块就是一个Javascript文件。代码书写格式如下:
define(factory);
- define是全局函数,来定义模块
- 仅接收一个factory参数,可以是函数,对象,字符串等类型
1、factory为对象、字符串等非函数类型时候,表示模块的接口是该对象、字符串等值
define({ "foo":"bar" });
通过字符串定义模版模块
define('I am a template.My name is {{name}}.');
2、factory为函数时候,表示模块的构造方法。
执行该方法,可以得到模块向外提供的接口。默认3个参数:require 、 exports 、 module
define(function(require,exports,module){ //... });
require
--------- 是一个方法,用来获取其他模块提供的接口。
define(function(require){ var a = require('./a'); a.doSomething; });
require接受模块标识作为唯一参数,模块标识书写需要遵循一些规范。
require.async
---------- 可以用来异步加载模块,并在加载完成后执行指定的回调。
define(function(require,exports,module){ //异步加载b require.async('./b',function(b){ b.doSomething; }); //异步加载多个模块 require.async(['./c','./d'],function(c,d){ // ........ }) });
require.resolve
--------- 使用模块系统内部的路径解析机制来返回模块的路径。该函数不会加载模块,只返回解析后的绝对路径。
define(function(require,exports){ console.log(require.resolve('./b')); //../b.js });
require.cache
---------- 可以查看模块系统加载过的所有模块。
某些情况下,需要重新加载某个模块,可以得到该模块的url,然后通过delete require.cache[url] 来将其信息删除。
exports
-------- 是一个对象,用来向外提供模块接口。
define(function(require,exports){ exports.foo = "bar"; exports.doSomething = function(){ ............... } });
除了给exports对象增加成员,还可以以return的方式直接向外提供接口。
define(function(require,exports,module){ return { fool: "bar", doSomething:function(){ ............. } }; });
当然如果只是返回一个对象,可以直接:
define({ foo: "bar", doSomething:function(){} });
注释:在factory里面给exports重新赋值是没有意义的,因为exports仅仅是module.exports的一个引用,直接给exports重新赋值并不会修改module.exports的值。
看下面这个错误的例子:
define(function(require,exports,module){ exports = { foo: "bar", doSomething:function(){} } });
正确的应该是:
define(function(require,exports,module){ module.exports = { foo: "bar", doSomething:function(){} } });
module
module 是一个对象,存储了与当前模块关联的一些属性和方法。
- module.id
---------- 模块标识
define(function(require,exports,module){ console.log(require(module.id) === exports); // true });
- module.uri
------------ 根据模块系统的路径解析规则得到的模块绝对路径
- module.dependencies
------------ 是一个数组,标识当前模块的依赖列表
- module.parent
------------ 指向初始化调用当前模块的模块。可以得到模块初始化的callstack
- module.factory
------------ 指向define(factory)中的factory参数
------------ 当前模块的状态,是一个数值
- module.exports
------------ 当前模块对外提供的接口
传给factory构造方法的exports参数是module.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.require
在module环境中运行require,一般用于插件开发
扩展阅读:
评论
2 楼
zhangyaochun
2012-12-04
key232323 写道
当然如果只是返回一个对象,可以直接:
Js代码
define(function(){
foo: "bar",
doSomething:function(){}
});
这个代码是不是语法错误?
应该是
define(function(){
return {
foo: "bar",
doSomething:function(){}
};
});
吧?
Js代码
define(function(){
foo: "bar",
doSomething:function(){}
});
这个代码是不是语法错误?
应该是
define(function(){
return {
foo: "bar",
doSomething:function(){}
};
});
吧?
恩,笔误了,其实就是定义一个对象
define({
foo: "bar",
doSomething:function(){}
});
1 楼
key232323
2012-11-20
当然如果只是返回一个对象,可以直接:
Js代码
define(function(){
foo: "bar",
doSomething:function(){}
});
这个代码是不是语法错误?
应该是
define(function(){
return {
foo: "bar",
doSomething:function(){}
};
});
吧?
Js代码
define(function(){
foo: "bar",
doSomething:function(){}
});
这个代码是不是语法错误?
应该是
define(function(){
return {
foo: "bar",
doSomething:function(){}
};
});
吧?
发表评论
-
require相关
2013-05-02 18:00 0require 是AMD规范下的 ... -
element.onafterscriptexecute
2013-01-05 11:19 1498场景: 在<script>标签的代码执行 ... -
element.onbeforescriptexecute
2013-01-05 11:12 1977场景: 当script标签要执行前触发,当时如果是动 ... -
document.currentScript
2013-01-05 10:51 3431场景: 如何得到正在执行的script元素? ... -
CMD与AMD的区别
2012-10-21 20:06 8062本文来自玉伯在zhihu上的一个回答,个人整理学习! ... -
谈谈requireJS与seaJS的异同
2012-10-21 19:35 2257主要内容来自seajs的issues,个人整理学习用! ... -
谈谈getAttribute来获取节点的src值
2012-10-10 17:29 2801此代码片段来源与seajs 首先关于hasA ... -
判断是否是css文件
2012-10-10 15:04 1330此代码片段来自seajs var IS_CS ... -
seajs相关探究如何包裹基础库
2012-10-10 12:24 1638问题: 在使用seajs的时候,我们其实也需要使用一 ... -
seajs相关探究模块寻址
2012-10-09 13:04 1525在前面介绍了一下seajs加载模块对于的api http:// ... -
seajs相关探究模块加载api
2012-10-08 18:02 2033require --------- ... -
seajs源码相关之dirname
2012-10-08 17:35 1627其实很多寻址需求里面都会有这样的api设计 举例: ... -
seajs源码相关之模块文件路径名相关的api
2012-10-08 17:08 1295判断文件路径相关,来源于seajs的源码 fun ... -
seajs相关探究开篇
2012-10-08 16:50 1534前言: 各种关于seajs的介绍就不具体介绍了,如果你 ... -
模块化之何为模块系统
2012-10-03 20:41 1325本文来自 lifesinger 在seajs里面的一篇issu ... -
模块化之require书写约定
2012-10-03 19:11 1393书写模块代码的时候我们有一些约定: ... -
Module.STATUS的意义
2012-10-03 16:39 1591在CMD规范那篇里面简单地提了一下module对象下有一个属性 ... -
翻译一下Modules/Wrappings规范
2012-09-30 23:45 1729全文来自common.js的wiki里面的关于Modules/ ... -
模块化之AMD
2012-09-30 22:14 3163前言: 即将又是在北京的一个十一,突然想起了什么,去 ... -
模块化相关的整理
2012-05-15 14:02 01、模块化: 软件总体结构体现模块化思想 ...
相关推荐
JS模块化标准技术.JAVASCRIPT的几种模块化技术 作为前端重要组成部分的javascript语言,其面向对象...所以要实现代码的模块化,需要一些标准:AMD,CMD 针对2种模块化也有现成的js模块化库SeaJs,require.js 今天来个教程
引入模块的方式SeaJS的使用举例(自定义模块)1、创建项目结构在工程文件中新建如下目录:| modules2、下载SeaJS,并导入官网: https://s
引入模块的方式SeaJS的使用举例(自定义模块)1、创建项目结构在工程文件中新建如下目录:| modules2、下载SeaJS,并导入官网: https://s
除了解决命名冲突和依赖管理,使用 Sea.js 进行模块化开发还可以带来很多好处: 模块的版本管理。通过别名等配置,配合构建工具,可以比较轻松地实现模块的版本管理。 提高可维护性。模块化可以让每个文件的职责...
浅析AMD CMD CommonJS规范--javascript模块化加载学习心得总结.docx
《模块化系列》彻底理清 AMD,CommonJS,CMD,UMD,ES6
模块化开发及AMD、CMD、Require.js、sea.js、common.js、ES6的对比;模块化开发就是封装细节,提供使用接口,彼此之间互不影响,每个模块都是实现某一特定的功能。模块化开发的基础就是函数
js模块系统介绍的ppt,简要介绍js现有的几个模块规范,包括commonJS模块规范,amd,cmd,es6模块系统。并详细对比seaJS和requireJS的异同
易语言世恒的模块化开发更新109日源码,系统接口_取版本信息,系统接口_取接口信息,外部接口_统一调用接口,外部接口_统一移动窗口,SetParent,工具条_项目名称,卷帘菜单_项目名称,内部接口_加载插件,内部接口_调整插件,...
引入模块的方式SeaJS的使用举例(自定义模块)1、创建项目结构在工程文件中新建如下目录:| modules2、下载SeaJS,并导入官网: https://s
引入模块的方式SeaJS的使用举例(自定义模块)1、创建项目结构在工程文件中新建如下目录:| modules2、下载SeaJS,并导入官网: https://s
requirejs seajs amd cmd,该PPT主要用于讲解前端模块化的前世今身。 requirejs seajs amd cmd,该PPT主要用于讲解前端模块化的前世今身。
跨环境共享,模块化遵循AMD或CMD规则 通过脚手架实现模块化后的代码版本管理 AMD 、 CMD 是什么,有何区别? 对于没有Class,没有Package标准的Javascript脚本而言,他们是前端的模块化规范,各有优势。 发展背景:...
之前,模块化开发一直是由第三方库来模拟的,比较知名的有AMD规范和CMD规范。 两个规范分别对应requirejs和seajs。 而现在,ES6提出了自己的模块化统一标准。 一个ES6的模块是一个包含了js代码的文件。ES6里没有所谓...
在ES6前, 前端就使用RequireJS或者seaJS实现模块化, requireJS是基于AMD规范的模块化库, 而像seaJS是基于CMD规范的模块化库, 两者都是为了为了推广前端模块化的工具, 更多有关AMD和CMD的区别, 后面参考给了...
这是一篇关于javascript模块化AMD,CMD,CommonJS的学习总结,作为记录也给同样对三种方式有疑问的童鞋们,有不对或者偏差之处,望各位大神指出,不胜感激。 本篇默认读者大概知道require,seajs的用法(AMD,CMD用法),...
模块化是指在解决某一个复杂问题或者一系列的杂糅问题时,依照一种分类的思维把问题进行系统性的分解以之处理。模块化是一种处理复杂系统分解为代码结构更合理,可维护性更高的可管理的模块的方式。可以想象一个巨大...
sea.js简单使用教程下载sea.js, 并引入创建项目结构定义sea.js的模块代码//内部变量数据var data = 'atguigu.com'//内部
fis3 已经默认不自带模块化开发支持,那么如果需要采用 cmd 规范作为模块化开发,请使用此插件。 请配合 sea.js 一起使用。 注意:需要对目标文件设置 isMod 属性,说明这些文件是模块化代码。 fis.match('/modules/...
CommonJS 用同步的方式加载模块,在服务端,模块文件都存在本地磁盘,读取速度非常快,所以问题不大。ES6 的模块不是对象,import 命令会被 Java