• AMD & CMD


    如果你听过js模块化这个东西,那么你就应该听过或CommonJS或AMD甚至是CMD这些规范咯,我也听过,但之前也真的是听听而已。

     
       现在就看看吧,这些规范到底是啥东西,干嘛的。
     
     
     
    一、CommonJS
     
     CommonJS就是为JS的表现来制定规范,因为js没有模块的功能所以CommonJS应运而生,它希望js可以在任何地方运行,不只是浏览器中。
     
     CommonJS能有一定的影响力,我觉得绝对离不开Node的人气,不过喔,Node,CommonJS,浏览器甚至是W3C之间有什么关系呢,我找到了个贴切的图:
     
     
     
      |---------------浏览器----- ------------------|        |--------------------------CommonJS----------------------------------|
     
      |  BOM  |       | DOM |        | ECMAScript |         | FS |           | TCP |         | Stream |        | Buffer |          |........|
     
      |-------W3C-----------|       |---------------------------------------Node--------------------------------------------------|
     
     
     
    CommonJS定义的模块分为:{模块引用(require)} {模块定义(exports)} {模块标识(module)}
     
    require()用来引入外部模块;exports对象用于导出当前模块的方法或变量,唯一的导出口;module对象就代表模块本身。
     
     
     
    比如说我们就可以这样用了:
     
    复制代码
    1 //sum.js
    2 exports.sum = function(){...做加操作..};
    4 //calculate.js
    5 var math = require('sum');
    6 exports.add = function(n){
    7     return math.sum(val,n);
    8 };
    复制代码
     
     
    虽说Node遵循CommonJS的规范,但是相比也是做了一些取舍,填了一些新东西的。
     
    不过,说了CommonJS也说了Node,那么我觉得也得先了解下NPM了。NPM作为Node的包管理器,不是为了帮助Node解决依赖包的安装问题嘛,那它肯定也要遵循CommonJS规范啦,它遵循包规范(还是理论)的。
     
    CommonJS WIKI讲了它的历史,还介绍了modules和packages等。
     
     
     
    二、AMD
     
    CommonJS是主要为了JS在后端的表现制定的,他是不适合前端的,为什么这么说呢?
     
    这需要分析一下浏览器端的js和服务器端js都主要做了哪些事,有什么不同了:
     
     
     
    ---------------------------------------服务器端JS   |    浏览器端JS-------------------------------------------
     
                                       相同的代码需要多次执行  |    代码需要从一个服务器端分发到多个客户端执行
     
                                         CPU和内存资源是瓶颈   |    带宽是瓶颈
     
                                            加载时从磁盘中加载   |    加载时需要通过网络加载
     
    ---------------------------------------------------------------------------------------------------------------
     
     
     
    于是乎,AMD(异步模块定义)出现了,它就主要为前端JS的表现制定规范。
     
    AMD就只有一个接口:define(id?,dependencies?,factory);
     
    它要在声明模块的时候制定所有的依赖(dep),并且还要当做形参传到factory中,像这样:
     
     
     
    1 define(['dep1','dep2'],function(dep1,dep2){...});
     
     
    要是没什么依赖,就定义简单的模块,下面这样就可以啦:
     
     
     
    1 define(function(){
    2     var exports = {};
    3     exports.method = function(){...};
    4     return exports;
    5 });
     
     
    咦,这里有define,把东西包装起来啦,那Node实现中怎么没看到有define关键字呢,它也要把东西包装起来呀,其实吧,只是Node隐式包装了而已.....
     
    RequireJS就是实现了AMD规范的呢。
     
    这有AMD的WIKI中文版,讲了很多蛮详细的东西,用到的时候可以查看:AMD的WIKI中文版
     
     
     
    三、CMD
     
    大名远扬的玉伯写了seajs,就是遵循他提出的CMD规范,与AMD蛮相近的,不过用起来感觉更加方便些,最重要的是中文版,应有尽有:seajs官方doc
     
     
     
    1 define(function(require,exports,module){...});
     
     
    用过seajs吧,这个不陌生吧,对吧。
     
     
     
     
    玉伯对于 AMD 与 CMD 区别的解释:
     
        AMD 是 RequireJS 在推广过程中对模块定义的规范化产出。
        CMD 是 SeaJS 在推广过程中对模块定义的规范化产出。
     
        类似的还有 CommonJS Modules/2.0 规范,是 BravoJS 在推广过程中对模块定义的规范化产出还有不少??
     
     
        这些规范的目的都是为了 JavaScript 的模块化开发,特别是在浏览器端的。
        目前这些规范的实现都能达成浏览器端模块化开发的目的。
     
     
        区别:
     
     
        1. 对于依赖的模块,AMD 是提前执行,CMD 是延迟执行。不过 RequireJS 从 2.0 开始,也改成可以延迟执行(根据写法不同,处理方式不同)。CMD 推崇 as lazy as possible.
     
        2. CMD 推崇依赖就近,AMD 推崇依赖前置。看代码:
     

    1. // CMD
    2. define(function(require, exports, module) {
    3.     var a = require('./a')
    4.     a.doSomething()
    5.     // 此处略去 100 行
    6.     var b = require('./b') // 依赖可以就近书写
    7.     b.doSomething()
    8.     // ...
    9. })
    10. // AMD 默认推荐的是
    11. define(['./a', './b'], function(a, b) { // 依赖必须一开始就写好
    12.     a.doSomething()
    13.     // 此处略去 100 行
    14.     b.doSomething()
    15.     // ...
    16. })
     
    虽然 AMD 也支持 CMD 的写法,同时还支持将 require 作为依赖项传递,但 RequireJS 的作者默认是最喜欢上面的写法,也是官方文档里默认的模块定义写法。
     
     
        3. AMD 的 API 默认是一个当多个用,CMD 的 API 严格区分,推崇职责单一。比如 AMD 里,require 分全局 require 和局部 require,都叫 require。CMD 里,没有全局 require,而是根据模块系统的完备性,提供 seajs.use 来实现模块系统的加载启动。CMD 里,每个 API 都简单纯粹。
     
     
        4. 还有一些细节差异,具体看这个规范的定义就好,就不多说了。
  • 相关阅读:
    什么是三元表达式,遇到三元表达式,你该如何去看代码执行的结果,下面的方法简单实用!!!
    遍历某一个标签中的内容;python+selenium定位到列表整体,使用for循环获取列表文本;可用于校验列表是否存在你需要的文本内容
    Selenium3+python3--如何定位鼠标悬停才显示的元素
    selenium中get_attribute的简单使用
    css层叠样式
    前端初识
    视图,触发器,事务,存储过程,内置函数,索引
    pymysql基本操作
    多态与绑定方法
    封装与组合
  • 原文地址:https://www.cnblogs.com/rhett-web/p/5308474.html
Copyright © 2020-2023  润新知