AMD是一种为浏览器环境设计的一种异步模块加载规范,
AMD规范全称是Asynchronous Module Definition,即异步模块加载机制。从它的规范描述页面看,AMD很短也很简单,但它却完整描述了模块的定义,依赖关系,引用关系以及加载机制。从它被requireJS,NodeJs,Dojo,JQuery使用也可以看出它具有很大的价值,没错,JQuery近期也采用了AMD规范。 作为一个规范,只需定义其语法API,而不关心其实现。
AMD规范简单到只有一个API,即define函数:
define([module-name?], [array-of-dependencies?], [module-factory-or-object]);
其中:
module-name: 模块标识,可以省略。
array-of-dependencies: 所依赖的模块,可以省略。
module-factory-or-object: 模块的实现,或者一个JavaScript对象。
require.js
遵循AMD规范,是一种小巧的js模块载入框架,可以运行在浏览器以及node环境下,实现模块化加载。
优点:
1、防止js加载阻塞页面渲染
2、使用程序调用的方式加载js,实现异步加载,按需加载
基本API
定义三个变量:
1、define:定义一个模块
a.js
define(function(){
function fun1(){
alert("it works");
}
fun1();
})2、require===require.js,一般使用require更简短:加载依赖模块,并执行加载完后的回调函数
通过define函数定义了一个模块,然后再页面中使用:
require(["js/a"]);来加载该模块(
注意require中的依赖是一个数组,即使只有一个依赖,你也必须使用数组来定义
),require API的第二个参数是callback,一个function,是用来处理加载完毕后的逻辑,如:
require(["js/a"],function(){
alert("load finished");
})