异步模块定义AMD

全称为Asynchronous Module Definition,异步组件(或模块)定义。AMD是一种机制,使用这种机制,组件和它的依赖就可以实现异步加载。

Define方法

define(id?, dependencies?, factory);

组件ID

组件ID是组件的唯一标识符,在和组件ID一对一的脚本文件(一个脚本文件中只有一个define)中这个ID可以没有,而且最好没有。这是因为组件加载器在请求组件的时候是必须给一个组件ID的,而且需要配置组件ID对应的脚本文件路径。加载器根据文件路径就能找到对应的组件脚本文件。所以,加载器可以直接用请求时使用的ID作为这个组件的ID。这样的好处是组件转移到其它项目的时候不需要怕ID冲突而需要修改组件ID,所以,使用define方法定义组件的时候,最好不要设置组件ID。

而且,根据AMD规范,define方法的第一个参数,组件ID必须是顶级或绝对ID,不能是相对ID。这更容易导致组件ID冲突所以,所以,我认为更不应该在define方法中设置组件ID。

AMD认为使用define可以帮助静态分析工具,比如build,我觉得没这个必要,因为更多时候在define中组件ID都没有,分析没有意义。

根据AMD规范,一个文件中定义多个组件也是可以的,但这就必须给每个define分配一个组件ID。

组件ID格式

注意,在define方法中出现的组件ID必须是顶级或绝对ID。但在require方法或define的依赖数组中出现的组件ID,可以是相对ID(相对于当前组件的ID,而不是相对于组件的路径),并且完全兼容CommonJS关于组件ID格式的规范

CommonJS关于组件ID的约定:

l  组件ID由‘/‘分隔的词组成,每个词必须是驼峰式写法,也可以是‘.‘、‘..‘,用于表示相对关系;

l  组件ID可以有‘.js‘后缀,也可以没有‘.js‘后缀;

举例:

假如组件‘jquery/dialog‘对应路径‘jquery/ui/dialog.js‘,而它依赖‘jquery/jquery.js‘,就需要在‘dialog.js‘文件中把require写成这样:require( ‘../jquery‘)或require(‘../jquery.js‘)。

依赖数组

也就是第二个数组,依赖数组包含依赖的组件ID,这里的组件ID允许相对ID。如果没有定义依赖数组,理论上默认是[‘require‘,‘exports‘,‘module‘],但这可以取决于factory这个方法的参数个数。如果参数只有一个,那么依赖数组就可以只是[‘require‘],其它两个依此类推。

Factory

如果factory是个方法,它的返回值就是该组件对外开发的值。如果factory是个对象,那么factory就是对外开放的值。

Define.amd

这个属性是个object,有这个属性就表示这个全局的define方法符合AMD规范。至于amd有什么属性,AMD没有规定,可以根据情况自己写。

Require方法

AMD对于require方法的要求比define低,组件加载器可以随意发挥,只要保证能正常工作即可。比如requirejs的require方法就可以一次要求多个组件,而根据CommonJS规范的组件加载器一次只能要求一个组件。

CommonJS

根据CommonJS的指导,CommonJS是没有define方法的,依赖完全通过require(‘module-id‘)获取。好在在浏览器中,Function对象有一个toString()方法,可以把方法转换成文本格式。通过在文本中搜索require(‘module-id‘)就可以获取所有依赖。缺点就是这样就失去了根据条件加载依赖的能力,而是一股脑全部加载。

AMD通过define方法声明模块,CommonJS是没有define方法的,所以AMD和CommonJS是两回事。但是,根据define的第二个参数的要求,可以看出,AMD的组件同样可以有require、exports、module这三个变量,因此,把CommonJS组件的代码拷贝到define方法中,大部分代码不用修改就可以用的,这点还是比较方便。

注意:Opera手机平台的Function对象没有toString()方法,因此CommonJS格式的脚本在这个平台上可以不能正常运行。

时间: 2024-12-20 02:24:20

异步模块定义AMD的相关文章

AMD异步模块定义介绍和Require.js中使用jQuery及jQuery插件的方法

AMD 模块 AMD(异步模块定义,Asynchronous Module Definition)格式总体的目标是为现在的开发者提供一个可用的模块化 JavaScript 的解决方案. AMD 模块格式本身是一个关于如何定义模块的提案,在这种定义下模块和依赖项都能够异步地进行加载.它有很多独特的优势,包括天生的异步及高度灵活等特性,这些特性能够解除常见的代码与模块标识间的那种紧密耦合.目前它已经被很多项目所接纳,包括jQuery(1.7). RequireJS RequireJS是一个工具库,主

AMD(异步模块定义规范)

AMD规范:https://github.com/amdjs/amdjs-api/wiki/AMD 本规范只定义了一个函数 "define",它是全局变量.函数的描述为: define(id?, dependencies?, factory); 第一个参数,id,是个字符串.它指的是定义中模块的名字,这个参数是可选的.如果没有提供该参数,模块的名字应该默认为模块加载器请求的指定脚本的名字.如果提供了该参数,模块名必须是“顶级”的和绝对的(不允许相对名字). 第二个参数,dependen

AMD模块定义规范

AMD 即Asynchronous Module Definition,中文名是"异步模块定义"的意思.它是一个在浏览器端模块化开发的规范,服务器端的规范是CommonJS.   模块将被异步加载,模块加载不影响后面语句的运行.所有依赖某些模块的语句均放置在回调函数中. AMD 是 RequireJS 在推广过程中对模块定义的规范化的产出. define() 函数 AMD规范只定义了一个函数 define,它是全局变量.函数的描述为: define(id?, dependencies?

JavaSript模块规范 - AMD规范与CMD规范介绍

JavaSript模块化 在了解AMD,CMD规范前,还是需要先来简单地了解下什么是模块化,模块化开发? 模块化是指在解决某一个复杂问题或者一系列的杂糅问题时,依照一种分类的思维把问题进行系统性的分解以之处理.模块化是一种处理复杂系统分解为代码结构更合理,可维护性更高的可管理的模块的方式.可以想象一个巨大的系统代码,被整合优化分割成逻辑性很强的模块时,对于软件是一种何等意义的存在.对于软件行业来说:解耦软件系统的复杂性,使得不管多么大的系统,也可以将管理,开发,维护变得"有理可循".

JavaSript模块规范 - AMD规范与CMD规范介绍[转]

原文地址:http://blog.chinaunix.net/uid-26672038-id-4112229.html JavaSript模块化 在了解AMD,CMD规范前,还是需要先来简单地了解下什么是模块化,模块化开发? 模块化是指在解决某一个复杂问题或者一系列的杂糅问题时,依照一种分类的思维把问题进行系统性的分解以之处理.模块化是一种处理复杂系统分解为代码结构更合理,可维护性更高的可管理的模块的方式.可以想象一个巨大的系统代码,被整合优化分割成逻辑性很强的模块时,对于软件是一种何等意义的存

JavaSript模块规范 - AMD规范与CMD规范介绍(转)

JavaSript模块规范 - AMD规范与CMD规范介绍 JavaSript模块化 在了解AMD,CMD规范前,还是需要先来简单地了解下什么是模块化,模块化开发? 模块化是指在解决某一个复杂问题或者一系列的杂糅问题时,依照一种分类的思维把问题进行系统性的分解以之处理.模块化是一种处理复杂系统分解为代码结构更合理,可维护性更高的可管理的模块的方式.可以想象一个巨大的系统代码,被整合优化分割成逻辑性很强的模块时,对于软件是一种何等意义的存在.对于软件行业来说:解耦软件系统的复杂性,使得不管多么大的

javascript 异步模块加载 简易实现

在javascript是没有类似java或其他语言的模块概念的,因此也不可能通过import或using等关键字来引用模块,这样造成了复杂项目中前端代码混乱,变量互相影响等. 因此在复杂项目中引入AMD的概念,AMD:全称是Asynchronous Module Definition,即异步模块加载机制.通过AMD可以不需要在页面中手动添加<script>来引用脚本,而通过定义依赖自动加载模块脚本,接下来的代码将讲解如何实现建议的AMD模块,如果需要查看比较详细的实现可以下载requirejs

CMD 模块定义规范

在 Sea.js 中,所有 JavaScript 模块都遵循 CMD(Common Module Definition) 模块定义规范.该规范明确了模块的基本书写格式和基本交互规则. 在 CMD 规范中,一个模块就是一个文件.代码的书写格式如下: define(factory); define Function define 是一个全局函数,用来定义模块. define define(factory) define 接受 factory 参数,factory 可以是一个函数,也可以是一个对象或字

前端模块规范AMD/UMD/CommonJs

.babelrc文件中的:module设置为false,为什么会要设置成false? 解释:使ES6模块语法转换到另一个模块类型(默认启用“commonjs”). 设置为假则不变换模块.或者传入(“amd”.“umd”,“systemjs”.“commonjs”). 什么是模块? Javascript的组件生态在最近几年的发展很给力,我们的可选性更加广泛了.这本是一件好事,但是当多个第三方Javascript在一起混合使用的时候,我们可能会遇到一个很尴尬的问题,那就是不是所有的组件都能在一起很愉