AMD规范

什么是AMD规范

AMD(Asynchronous Module Definition)，也就是异步模块定义。AMD规范，制定了定义模块的规则，使得模块之间的依赖可以被异步加载。这和浏览器的异步加载模块的环境刚好适应（浏览器同步加载模块会导致性能、可用性、调试和跨域访问等问题）。

所谓异步，就是所有的模块将被异步加载，模块的加载不影响它后面语句的运行。所有依赖这个模块的语句，都定义在一个回调函数中，等到加载完成之后，这个回调函数才会运行。这就是浏览器端模块加载器核心所在。

实际上AMD 是 RequireJS 在推广过程中对模块定义的规范化的产出

define方法：定义模块

AMD规范定义了一个自由变量或者说是全局变量 define 的函数，其作用是用来定义并暴露一个模块，函数代码如下：

define(id?, dependencies?, factory);

l  第一个参数，id（名字），是个字符串。它指的是定义中模块的名字，这个参数是可选的。如果没有提供该参数，模块的名字应该默认为模块加载器请求的指定脚本的名字。如果提供了该参数，模块名必须是“顶级”的和绝对的（不允许相对名字）。

l  第二个参数，dependencies（依赖），是个定义中模块所依赖模块的数组。依赖模块必须根据模块的工厂方法优先级执行，并且执行的结果应该按照依赖数组中的位置顺序以参数的形式传入（定义中模块的）工厂方法中。

l  第三个参数，factory（工厂方法），为模块初始化要执行的函数或对象。如果为函数，它应该只被执行一次。如果是对象，此对象应该为模块的输出值。

RequireJS的基础使用

index.html

// 首先引入require.js, 自定义属性data-main为总入口文件的路径
<script data-main="./js/index.js" src="./js/require.js"></script>

主入口文件 index.js

// index.js 以下两种方式都可以达到引入a.js和b.js的目的
// 方式一
define(["b", "a"], function (b, a) {
    //等b.js加载完成后运行该函数
    //模块内部的代码
    console.log(b, a)
})
// 方式二：类似commonJs的书写方式
define((require, exports, module) => {
    var a = require("a"),
        b = require("b");
    console.log(b, a)
})

模块1 a.js

// 这里引入了b模块并导出a模块的内容
define(["b"], function(b){
    console.log("a模块的内部代码")
    return "a模块的内容";
})

模块2 b.js

// 这里导出了模块b的内容
define(function () {
    //模块内部的代码
    console.log("b模块的内部代码")
    var a = 1;
    var b = 234;
    return {
        name: "b模块",
        data: "b模块的数据"
    }
})