• amd模块定义模式


    谈及前端模块化,自然会想到AMD(异步模块定义)和CMD(通用模块定义),这里我着重谈一下AMD的相关内容

    AMD的整体目标是提供模块化的JavaScript解决方案,以便开发人员使用。

    关于AMD有两个关键概念是值得我们注意的,它们是用于模块定义的define方法和用于处理依赖加载的require方法。使用以下方式,define用于定义已命名或未命名模块。

    define(
    module_id//可选
    [dependencies]//可选
    function(){}//实例化模块或对象的函数
    );

    module_id是一个可选参数,当遗漏这个参数时,我们程这个参数是匿名的。
    回到define方法,dependencies参数表示我们定义模块所需的依赖数组,第三个参数适用于执行实例化模块的函数。示例如下:

    define(
    "myModule",
    ['foo','bar'],
    function (foo,bar){
    var myModule={
    fn:function(){
    console.log("hello");
    }
    };
    return myModule;
    }
    )
    另外一种方式,return直接返回要暴露的内容。
    define(
    "myModule",
    ['math', 'graph'],
    function(math, graph) {
    return {
    plot: function(x, y) {
    return graph.draw(math.grid(x, y))
    }
    }
    };
    })
    那如果我们希望动态获取依赖呢,这样做依赖的加载会不会更灵活高效。
    define(function(require){
    var isReady=false;
    var foobar;
    require(["foo","bar"],function(foo,bar){
    isReady=true;
    foobar=foo()+bar();
    });
    //依然返回一个模块
    return{
    isReady:isReady;
    foobar:foobar;
    }
    });
    模块定义好以后,如何加载使用呢,这里有curl.js和RequireJS两种类型的加载器。
    以最熟悉的requireJS为例,加载上面定义好的myModule模块

    require(["app/myModule"],function(myModule){

    var module=new myModule();
    module.fn();


    })
    为何AMD是编写模块化JavaScript的更好选择

    ·对于如何完成灵活模块的定义提供了明确的建议

    ·比很多人依赖的现有全局命名空间和<script>标签解决方案都更加简洁。有一种简洁的方式可以声明可能的独立模块和依赖。

    ·封装模块的定义,帮助我们避免全局命名空间被污染

    ·如果需要,可以延迟加载脚本
    ————————————————
    版权声明:本文为CSDN博主「u013344815」的原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接及本声明。
    原文链接:https://blog.csdn.net/u013344815/java/article/details/66475851

  • 相关阅读:
    List<T> 添加 DataTable
    sql 在not in 子查询有null值情况下经常出现的陷阱
    SQL查询~ 存在一个表而不在另一个表中的数据
    SQL Server xtype
    jQurey 获取当前时间
    sp_rename
    Longest Substring Without Repeating Characters
    Fraction to Recurring Decimal
    链表翻转系列
    蓄水池抽样
  • 原文地址:https://www.cnblogs.com/fsg6/p/13140143.html
Copyright © 2020-2023  润新知