AMD、CMD、ES6模块的理解

commonJs

是服务端的模块规范,Node.js采用了这个规范( 文件已经存在本地 不用考虑非同步加载的情况)。浏览器要从服务器加载模块,必须采用非同步的模式。所以浏览器一般采用AMD

ComonJs规范加载模块是同步的,也就是加载完才能执行后边操作。

Require用于加载模块文件:使用require加载模块:读入并执行JavaScript文件,返回该模块的对象,没有该模块则报错

特点:

  1. 所有代码都运行在模块作用域,不会污染全局作用域

  2. 模块可以多次加载,但是智慧第一次加载时运行一次,然后运行结果就被缓存了,以后再加载,就直接读取缓存结果。想要模块再次运行,必须清楚缓存

  3. 加载顺序,按照其代码中出现的顺序

  4. 便于服务器端和桌面应用的使用

缺点

ComonJS模块不适合浏览器,因为浏览器的加载机制不支持同步。需要用打包工具把所有CommonJs模块打包成一个文件。因为该模块的加载是同步的,浏览器获取一个资源是通过发送Http请求后获得的,这意味着阻塞加载,从而在浏览器出现假死现象。

CommonJs和commonjs2区别:

Commonjs规定了exports

Commonjs3是规定用module.export

Exports是module.export的引用,module.exports是exports的具体实现

推荐阅读:https://javascript.ruanyifeng.com/nodejs/module.html

使用define定义模块

ES6模块

Important、export ES6模块化不是对象,import会在JavaScript引擎静态分析,在编译时就引入模块代码,而非在代码运行时加载,因此也不适合异步加载

特点:

  1. 变量只在模块内有效,即局部变量。

  2. 同一模块加载多次之运行一次

ES6模块规范和commonJs规范运行机制区别

  1. CommonJS模块是运行时加载,ES6是编译时输出接口

  2. 运行时加载:commonJs模块就是对象;即在输入时是先加载整个模块生成一个对象,然后再从这个对象上面读取方法,这种加载成为运行时加载

编译时加载:ES模块不是对象,而是export命令显示指定输出的代码,import时采用静态命令的形式。即在import时可以指定加载某个输出值,而不是加载加载整个模块,这种加载称为:编译时加载。(代码静态解析阶段就会生成)

  1. CommonJs模块输出的是一个值的拷贝,ES6模块输出的值是值的引用。

即:comonJs值一旦输出模块内部变化就影响不到这个值。原始类型的会被缓存

Es6模块是动态引用,并且不会缓存值,模块里边的变量绑定其所在的值。

AMD

非同步加载模块,允许指定回调函数。

  • 异步加载定义,该规范是RequireJs在推广过程中对模块定义的规范化产出,是commonJs的一个延伸。对于依赖的模块,AMD是提前执行,异步并行加载。

  • 需要define来确定一个模块,用require()加载模块

  • 定义:define(module,[dep1,dep2],callback)

  • 机制:通过require加载时,它会先加载对应的依赖,等依赖的资源加载完之后,会执行回调函数,将依赖作为入参,执行对应的业务逻辑。

  • 特点:AMD机制是浏览器编程范式,最大的特点强调依赖前置。它是在客户端使用的,由于资源都在服务器上,所以它是异步加载的

  • AMD默认推荐的是:define([‘./a’,’./b’],function(a,b){

//依赖必须一开始就写好

a.doSomething() ….

b.doSomething()

})

CMD

机制与AMD类似,最大的区别就是CMD强调延迟加载,对应的依赖等到回调函数里执行具体的依赖语句才回去加载,但是AMD在后续版本也支持了延迟加载

机制/特点同上

Define(function(require,exports,module){let a = require(‘./a’);a.doSomething;…let a = require(‘./b’);…})

使用方式

CommonJs:require引用模块,module.exports暴露接口

AMD:require引用模块 使用define函数的return暴露接口

CMD:require引用模块 module.exports或exports暴露接口

ES6:import 引用模块,export default暴露接口

模块加载方式

commonJs:运行时加载,一个模块就是一个对象,加载一个模块就是加载这个模块的所有方法,然后读取其中需要的方法

AMD:并行加载,提前执行;

CMD:并行加载,按需加载;

ES6: 编译时加载,在模块编译时就完成加载,引用的时候只加载需要的方法,其它方法不加载

©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 213,752评论 6 493
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 91,100评论 3 387
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 159,244评论 0 349
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 57,099评论 1 286
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 66,210评论 6 385
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 50,307评论 1 292
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 39,346评论 3 412
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 38,133评论 0 269
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 44,546评论 1 306
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 36,849评论 2 328
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 39,019评论 1 341
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 34,702评论 4 337
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 40,331评论 3 319
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 31,030评论 0 21
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 32,260评论 1 267
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 46,871评论 2 365
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 43,898评论 2 351

推荐阅读更多精彩内容