AMD 基础概念
AMD(Asynchronous Module Definition,异步模块定义)是一种用于 JavaScript 的模块加载规范。从 Dojo 1.7 版本开始,框架原生支持这种写法,让代码结构更清晰,调试也更方便。
虽然 Dojo 为了兼容旧版本默认运行在同步模式,但若要启用异步加载能力,需要在配置中显式开启 async 属性:
<script data-dojo-config="async: true" src="js/lib/dojo/dojo.js"></script>
Require 与 Define 核心用法
require 函数
require 主要用于加载依赖并执行回调。它接受三个参数:
- configuraton(可选):一个对象,允许在运行时动态调整 loader 的配置。
- dependencies(可选):依赖模块数组。若指定,这些模块会在代码解析前被加载完成,并按顺序作为参数传入回调函数。
- callback 函数:封装了依赖加载后的逻辑。Loader 解析完依赖后,会将模块实例作为参数传递给此函数,供全局共享使用。
define 函数
define 用于定义一个新模块,参数如下:
- moduleId(可选):模块标识符。早期 AMD Loader 或兼容旧版 Dojo 时可能需要。
- dependencies(可选):依赖数组。同
require中的依赖项,加载后会依次作为参数传给工厂函数。 - factory:可以是返回值本身,也可以是工厂函数。若是函数,只会被调用一次,返回值会被 Loader 缓存。
值得注意的是,模块创建是懒加载和异步的。调用 define 时不会立即执行工厂函数,依赖也不会立刻下载。只有当有代码真正请求该模块时,才会触发加载和解析。
Loader 工作原理
理解 Loader 的行为有助于排查加载问题:
- 解析阶段:调用
require时,Loader 会结合baseURL和其他配置解析模块标识符,定位到实际的.js文件路径。 - 加载阶段:Loader 动态插入
<script>标签,将 URL 指向解析出的文件。 - 计算与缓存:脚本加载完成后,执行计算得到模块值。Loader 会记住这个引用,后续再次请求同一模块时直接返回缓存结果,避免重复加载。
当 AMD 模块被加载时,页面中插入的 script 标签会触发 define 函数执行。Loader 对模块的引用最终指向的是 factory 函数的返回值;如果 factory 不是函数而是直接的值,则引用该值本身。

