AMD(异步模块定义)是为浏览器环境设计的,因为 CommonJS 模块系统是同步加载的,当前浏览器环境还没有准备好同步加载模块的条件。

AMD 定义了一套 JavaScript 模块依赖异步加载标准,来解决同步加载的问题。

模块通过 define 函数定义在闭包中,格式如下:

define(id?: String, dependencies?: String[], factory: Function|Object);

id 是模块的名字,它是可选的参数。

dependencies 指定了所要依赖的模块列表,它是一个数组,也是可选的参数,每个依赖的模块的输出将作为参数一次传入 factory 中。如果没有指定 dependencies,那么它的默认值是 ["require", "exports", "module"]

define(function(require, exports, module) {})

factory 是最后一个参数,它包裹了模块的具体实现,它是一个函数或者对象。如果是函数,那么它的返回值就是模块的输出接口或值。

一些用例:

定义一个名为 myModule 的模块,它依赖 jQuery 模块:

define('myModule', ['jquery'], function($) {
// $ 是 jquery 模块的输出
$('body').text('hello world');
});
// 使用
define(['myModule'], function(myModule) {});

注意:在 webpack 中,模块名只有局部作用域,在 Require.js 中模块名是全局作用域,可以在全局引用。

定义一个没有 id 值的匿名模块,通常作为应用的启动函数:

define(['jquery'], function($) {
$('body').text('hello world');
});

依赖多个模块的定义:

define(['jquery', './math.js'], function($, math) {
// $ 和 math 一次传入 factory
$('body').text('hello world');
});

模块输出:

define(['jquery'], function($) {

    var HelloWorldize = function(selector){
$(selector).text('hello world');
}; // HelloWorldize 是该模块输出的对外接口
return HelloWorldize;
});

在模块定义内部引用依赖:

define(function(require) {
var $ = require('jquery');
$('body').text('hello world');
});

AMD 规范的更多相关文章

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

    JavaSript模块化   在了解AMD,CMD规范前,还是需要先来简单地了解下什么是模块化,模块化开发?       模块化是指在解决某一个复杂问题或者一系列的杂糅问题时,依照一种分类的思维把问题 ...

  2. Javascript模块化编程(二):AMD规范

    Javascript模块化编程(二):AMD规范   作者: 阮一峰 原文地址:http://www.ruanyifeng.com/blog/2012/10/asynchronous_module_d ...

  3. AMD规范与CMD规范的区别

    AMD规范与CMD规范的区别是什么?    在比较之前,我们得先来了解下什么是AMD规范?什么是CMD规范?当然先申明一下,我个人也是总结下而已,也是网上看到的资料,自己总结下或者可以说整理下而已,供 ...

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

    JavaSript模块规范 - AMD规范与CMD规范介绍 JavaSript模块化 在了解AMD,CMD规范前,还是需要先来简单地了解下什么是模块化,模块化开发? 模块化是指在解决某一个复杂问题或者 ...

  5. AMD规范与CMD规范的区别是什么?

    AMD规范与CMD规范的区别是什么?    在比较之前,我们得先来了解下什么是AMD规范?什么是CMD规范?当然先申明一下,我个人也是总结下而已,也是网上看到的资料,自己总结下或者可以说整理下而已,供 ...

  6. Javascript模块化编程(二):AMD规范(转)

    这个系列的第一部分介绍了Javascript模块的基本写法,今天介绍如何规范地使用模块. (接上文) 七.模块的规范 先想一想,为什么模块很重要? 因为有了模块,我们就可以更方便地使用别人的代码,想要 ...

  7. JavaSript模块化-AMD规范与CMD规范

    JavaScript模块化 在了解AMD,CMD规范前,先来简单地了解下什么是模块化,模块化开发. 模块化是指在解决某一个复杂问题或者一系列的杂糅问题时,依照一种分类的思维把问题进行系统性的分解以之处 ...

  8. (转)JS模块化编程之AMD规范

    模块的规范 原文地址 先想一想,为什么模块很重要? 因为有了模块,我们就可以更方便地使用别人的代码,想要什么功能,就加载什么模块. 但是,这样做有一个前提,那就是大家必须以同样的方式编写模块,否则你有 ...

  9. JavaSript模块规范 - AMD规范与CMD规范介绍 (转载lovenyf.blog.chinaunix.net)

    JavaSript模块化   在了解AMD,CMD规范前,还是需要先来简单地了解下什么是模块化,模块化开发?       模块化是指在解决某一个复杂问题或者一系列的杂糅问题时,依照一种分类的思维把问题 ...

  10. Requirejs之AMD规范

    一.什么是AMD规范 AMD是Asynchronous Module Definition-----异步模块定义 AMD规范定义了2个函数define()与require() 下面我们来看一下定义方法 ...

随机推荐

  1. iOS Xcode 8 打包上架 配置文件问题 此构建版本无效 推送问题 攻克 刚刚 waiting for review

    煎熬...  本来xcode 7 打包正在审核了 还要修改一处购买问题  此时 xcode已经升级到xcode 8 了 升级后 很神奇 应用没报错 很好的运行 (网上很多说xib storyboard ...

  2. python 课堂笔记-if语句

    # Author:zyl _username = 'zyl' _password = 'zyl123' username = input("username:") password ...

  3. $Android去除系统默认的标题栏和全屏的三种方法

    在做应用的时候,很多时候是不需要系统自带的标题栏的,而是自己去实现标题栏,这就要去掉系统的标题栏,下面总结了三种方法.全屏也是一样的道理,也总结了实现的三种方法. (一)去除标题栏 1.方法1 在Ac ...

  4. 无法处理文件 MainForm.resx,因为它位于 Internet 或受限区域中,或者文件上具有 Web 标记。要想处理这些文件,请删除 Web 标记

    无法处理文件 MainForm.resx,因为它位于 Internet 或受限区域中,或者文件上具有 Web 标记.要想处理这些文件,请删除 Web 标记 问题: 由于文件锁定,VS不能正常读取. 解 ...

  5. 一个骑行者的独白,很不错,我就转载了。--原名是--<<关于认怂这件事>>

    一个骑行者的独白,很不错,我就转载了.--原名是--<<关于认怂这件事>>   PS:我不知道这些是对是错,但都不曾后悔,或许哪天我在生活面前也怂了,然后跑回大城市乖乖的当个小 ...

  6. awk的控制语句

    本章主要讲actions中的控制语句,和C语言的控制语句类似. 1.选择语句 if (condition) then-body else else-body 2.循环语句之while: while ( ...

  7. NoSQL数据库memcache和redis区别

    在web后台发开面试中,经常会被问道memcache和redis的区别和使用情况. 其中memcache和redis都是基于内存存储的缓存系统,存储形式key--value键值对的形式. 区别: 1. ...

  8. INSPIRED启示录 读书笔记 - 第23章 改进现有产品

    不是一味地添加功能 改进产品不是简单地满足个别用户的要求,也不能对用户调查的结果照单全收.能提高指标的功能才是关注的重点.应该找准方向,分析关键指标,有针对性地改进产品

  9. java 监控命令

    jps 查找java所有进程及对应pid -v 列出启动参数 有些默认的参数,使用-v是看不到的,需要执行如下: jcmd pid VM.flags jstack pid 查看该进程的堆栈信息 找到进 ...

  10. JavaScript中有时候需要获取当前的时间戳

    JavaScript中有时候需要获取当前的时间戳信息,下面列举了三种获取当前时间戳的方法,第一种方法只精确到秒,后两种方法精确到毫秒. 第一种方法 var timestamp1 = Date.pars ...