美文网首页
AMD 规范

AMD 规范

作者: daysun | 来源:发表于2017-02-04 16:54 被阅读22次

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 、CMD、CommonJS

    AMD规范: AMD规范: 全称"Asynchronous Module Definition", 称为异步模块加...

  • Requirejs学习以及简单实现

    Requirejs是AMD规范的比较好的实践,在看Requirejs之前先看下AMD的规范 AMD规范 看的是gi...

  • js模块化

    js的模块化大致分为4种规范 amd cmd commonjs 和es6模块化 1.amd规范 amd规范又叫异步...

  • AMD规范、CMD规范、CommonJS

    一、AMD规范 AMD规范,全称是Asynchronous Module Definition,即异步模块加载机制...

  • 动手实现一个AMD模块加载器(一)

    对于AMD规范的具体描述在这里可以找到AMD (中文版). AMD规范作为JavaScript模块加载的最流行的规...

  • 模块规范CommonJS以及AMD、CMD

    本文目录: 1.原始写法 2.CommonJS规范 3.AMD规范 4.CMD规范 5.AMD和CMD的区别 6....

  • AMD 规范

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

  • JS模块化工具

    AMD规范是依赖前置, CMD规范是依赖后置 AMD规范的加载器会把所有的JS中的依赖前置执行。 CMD是懒加载,...

  • 模块兼容

    模块兼容 兼容commonjs规范 nodeJs 兼容amd规范 requireJs 兼容browser规范 wi...

  • 总结一下RequireJS

    一、AMD规范 AMD(Asynchronous Module Definition,异步模块定义)指定一种机制,...

网友评论

      本文标题:AMD 规范

      本文链接:https://www.haomeiwen.com/subject/wyxsittx.html