一个模块就是实现特定功能的文件,有了模块,我们就可以更方便地使用别人的代码,想要什么功能,就加载什么模块。模块开发需要遵循一定的规范,各行其是就都乱套了。

AMD

AMD 规范是 CommonJS 模块规范的一个延伸,它的模块定义如下:

define(id?, dependencies?, factory);

它的模块 id 和依赖是可选的,与Node模块相似的地方在于 factory 的内容就是实际代码的内容。

下面是在 Node 是使用 AMD 规范的例子,该例子使用了第三方库 requirejs

// a.js
define(function() { return 'hello world'
});
// b.js
define(['a'], function(data) {    let exports = {}   exports.sayHello = function () {   console.log(data)   }   return exports
});
// index.js
const requirejs = require('requirejs');
requirejs.config({  nodeRequire: require
});
requirejs(['b'], function (obj) { obj.sayHello()
});

与 commonJS 不同之处在于,AMD 模块需要用 define 来明确定义一个模块,而在 Node 实现中是隐式包装的,它们的目的是进行作用域隔离,仅在需要的时候被引入,避免掉过去那种通过全局变量或者全局命名空间的方式,以免变量污染和不小心被修改。另一个区别则是内容需要通过返回的方式实现导出。

CMD

CMD规范由国内的玉伯提出,与AMD规范的主要区别在于定义模块和依赖引入的部分。AMD需要在声明模块的时候指定所有的依赖(依赖前置),通过形参传递依赖到模块内容中:

define(['dep1', 'dep2'], function (dep1, dep2) {    return function () {};
});

与AMD模块规范相比,CMD模块更接近于Node对CommonJS规范的定义,在依赖部分,CMD支持动态引入(就近依赖),示例如下。

下面是在 Node 是使用 CMD 规范的例子,该例子使用了第三方库 seajs

// a.js
define(function() { return 'hello world'
});
// b.js
define(function(require) {  let data = require('./a')    let exports = {}   exports.sayHello = function () {   console.log(data)   }   return exports
});
// index.js
const seajs = require('seajs');
let obj = require('./b')
obj.sayHello()

AMD和CMD最大的区别是对依赖模块的执行时机处理不同。

define(function(require, exports, module) {
// The module code goes here
});

require 、 exports 和 module 通过形参传递给模块,在需要依赖模块时,随时调用 require() 引入即可。三个参数表示的意思和commonJS规范相同。

彻底理解AMD和CMD相关推荐

  1. 理解AMD ,CMD,CommonJS规范

    https://blog.csdn.net/xcymorningsun/article/details/52709608 理解AMD ,CMD,CommonJS规范 2016年09月30日 10:33 ...

  2. javascript模块化之CommonJS、AMD、CMD、UMD、ES6

    javascript模块化之CommonJS.AMD.CMD.UMD.ES6 一.总结 一句话总结: CommonJS是同步加载模块,用在服务端:AMD是异步加载模块,用于浏览器端 1.为什么服务器端 ...

  3. JavaScript模块化 --- Commonjs、AMD、CMD、es6 modules

    随着前端js代码复杂度的提高,JavaScript模块化这个概念便被提出来,前端社区也不断地实现前端模块化,直到es6对其进行了规范,下面就介绍JavaScript模块化. 这篇文章还是希望能给大家一 ...

  4. 关于commonjs,AMD,CMD之间的异同

    1.简介 随着前端业务复杂度的增加,模块化成为一个大的趋势.而在ES6还未被浏览器所支持的情况下,commonjs作为ES6中标准模块加载方案,在客服端中的支持情况并不好,现在在客服端中有2中模块化的 ...

  5. 前端模块化,AMD与CMD的区别

    在JavaScript发展初期就是为了实现简单的页面交互逻辑,寥寥数语即可:如今CPU.浏览器性能得到了极大的提升,很多页面逻辑迁移到了客户端(表单验证等),随着web2.0时代的到来,Ajax技术得 ...

  6. CommonJs, AMD/RequireJs,CMD/seajs

    JavaSript模块化 在了解AMD,CMD规范前,还是需要先来简单地了解下什么是模块化,模块化开发? 模块化是指在解决某一个复杂问题或者一系列的杂糅问题时,依照一种分类的思维把问题进行系统性的分解 ...

  7. 模块化 AMD与CMD 规范

    JavaSript模块规范 - AMD规范与CMD规范介绍 2014-02-19 13:12:01 分类: JavaScript JavaSript模块化 在了解AMD,CMD规范前,还是需要先来简单 ...

  8. 前端模块化CommonJS、AMD、CMD、ES6

    一.前端模块化 什么是模块化?为什么前端需要模块化? js代码量激增,放在同一个文件里面,不容易维护,而且牵一发而动全身. 这时候就需要将代码按照逻辑放在不同的文件里面,按照一定的语法规则,遵循特定的 ...

  9. 再谈 JS中的模块规范(CommonJS,AMD,CMD)来自玉伯的seajs分析

    随着互联网的飞速发展,前端开发越来越复杂.本文将从实际项目中遇到的问题出发,讲述模块化能解决哪些问题,以及如何使用 Sea.js 进行前端的模块化开发. 恼人的命名冲突 我们从一个简单的习惯出发.我做 ...

最新文章

  1. 一套基于 SpringBoot 的完整高并发电商系统,拿去面试简直不要太好用!
  2. java params 参数_将params作为参数传递给类扩展方法的函数
  3. 大学计算机课算绩点吗,南京大学GPA是如何计算的
  4. Win10 ancona傻瓜安装tensorflow-gpu,ancona傻瓜安装pytorch-gpu
  5. 1732: 数花费(Kruscal)
  6. Webstrom 卡顿问题
  7. python剑指offer替换空格_《剑指Offer》字符串 替换空格
  8. python 中re模块学习随笔
  9. 程序猿都应学习的语言:看 25 张图学 UML
  10. JavaEE学习14(应用)--用户自动登陆
  11. 金蝶kis专业版系统登录服务器,金蝶kis专业版怎么远程连接服务器
  12. el-descriptions的入门学习
  13. 二十一世纪大学英语读写基础教程学习笔记(原文)——3 - Mothers(母亲)
  14. 【Python数据分析与可视化】Pandas统计分析-实训
  15. 抠脚大叔如何改变性别,Python实现变声器功能
  16. 是寒冬还是风口?2015年HTML5游戏完整产业链报告
  17. LC Uniboot相比于常规的LC光纤连接器有什么特点?
  18. Rpgmakermv(38)MOG_Theatrhythm
  19. CSS 样式的 initial(默认)和 inherit(继承)以及 unset
  20. 【Linux进程间通信】一、什么是IPC

热门文章

  1. Caffeine 和 Redis 居然可以这么搭,想不到吧!
  2. 魔幻的2020年,请程序员们收下这份秋招建议!
  3. “编程能力差,90%输在了数学上!”骨灰级开发:其实你们都是瞎努力!
  4. 5G 时代,优酷推出的帧享究竟是什么?
  5. 历时两年,微软物联网安全服务 Azure Sphere 全面上线!
  6. 凿渠造舟:视频会议的昨天与明天
  7. 还有 2 天,这场大咖云集的启智开发者大会即将启动!
  8. 颜值即正义!颜值爆表的几个数据交互的库来啦!
  9. 收下这份说明书,原来迈进智能计算的大门如此简单
  10. 告别大妈的灵魂拷问,Python 教你轻松完成垃圾分类!