【JS】AMD，CMD，CommenJS和ES6

本节我们来对比一下AMD，CMD，CommenJS和ES6

首先说一下什么是AMD，CMD和CommenJS。
其实这三个都是一种规范或者说标准。AMD是国外一个团队搞出来的异步模块定义，CMD是国内的淘宝团队搞出来的同步模块定义，其知名度不如AMD

AMD
AMD是RequireJS在推广过程中对模块定义的规范化产出。这听起来是不是很拗口？首先又蹦出来了一个新概念，什么是RequireJS?RequireJS 是一个JavaScript文件和模块加载器。我们知道ECMAScript是一个组织，Javascript是一门编程语言，JavaScript语言就是对ECMAscript组织制定语言标准的一种实现，那么同样的，AMD是一种概念，然后RequireJS就是对于这个AMD概念的一种脚本语言实现。

而且AMD是依赖前置的，就是说我们所依赖的所有包都要放在文件的最上方，然后进行异步加载。

下图是我们requireJS实现功能的一个例子

CMD
与AMD正好“相对”，AMD是异步模块化定义，CMD是同步模块化定义。CMD是SeaJS在推广过程中对模块定义的规范化产出。

CMD是就近依赖，项目中所依赖的包或者说库都是放在要调用的内容的就近部分，即用即返回。显然，他是一个同步的概念。

下图是我们SeaJS实现功能的一个例子

CommenJS
CommenJS是通过module.exports去定义的，其实在我们的浏览器中，是不支持module.exports的，但是我们的nodejs中是支持的，支持我们的CommenJS规范。

也就是说，我们在前端，都是通过AMD/CMD或者import等等来定义我们的模块，然后在nodejs后端，我们是通过CommenJS中来定义我们的模块。

下面看一个例子：

我们就是在后端通过exports语句来输出我们的模块。
我们可以通过module.export相当于没有名字的export default 默认输出。

ES6
ES6在模块化中新增了什么内容呢？就是export/import，这俩一定是成对出现的，只有export了，才能import。

注意，我们的AMD，CMD，CommenJS都是在ES5中就得到了支持，只有export/import是我们ES6中新增的。

一定要掌握好这些“软”的概念，其实大多数时候，往往是这些“软”知识可以帮助我们走的更远！

【JS】AMD，CMD，CommenJS和ES6相关推荐

JS JavaScript模块化（ES Module/CommonJS/AMD/CMD）
前言前端开发中,起初只要在script标签中嵌入几十上百行代码就能实现一些基本的交互效果,后来js得到重视,应用也广泛起来了, jQuery,Ajax,Node.Js,MVC,MVVM等的助力也使得 ...
CommonJS,AMD,CMD,ES6,require 和 import 详解
CommonJS,AMD,CMD,ES6 commonJS用同步的方式加载模块.在服务端,模块文件都存在本地磁盘,读取非常快,所以这样做不会有问题.但是在浏览器端,限于网络原因,更合理的方案是使用异步 ...
让你的插件兼容AMD, CMD ,CommonJS和原生 JS
模块标准 // 支持AMD,CMD以及原生js的引用if (typeof module !== 'undefined' && typeof exports === 'object' & ...
commonjs是什么_JavaScript模块化标准CommonJS/AMD/CMD/UMD/ES6Module的区别
JS-模块化进程随着js技术的不断发展,途中会遇到各种问题,比如模块化. 那什么是模块化呢,他们的目的是什么? 定义:如何把一段代码封装成一个有用的单元,以及如何注册此模块的能力.输出的值依赖引用: ...
关于 CommonJS AMD CMD UMD 规范的差异总结
根据CommonJS规范,一个单独的文件就是一个模块.每一个模块都是一个单独的作用域,也就是说,在一个文件定义的变量(还包括函数和类),都是私有的,对其他文件是不可见的. // foo.js var ...
兼容多种模块规范(AMD,CMD,Node)的代码
前言昨天,公司同事问了我如下一个问题: 说他在看一个插件时,看到了源码结构如截图所示,他知道(function(){})()是一种立即执行函数,但是在截图中,最后的那个圆括号里又写了一个函数func ...
AMD/CMD/CommonJs到底是什么？它们有什么区别？
这篇文章总结的很好. 知道JS有模块化开发的说法,也偶尔听过requireJs,AMD,CMD等等名字,甚至使用node的时候,还用过require之类的方法,但是对这些一直没有一个明确的认识和概念. ...
AMD, CMD, CommonJS和UMD
AMD, CMD, CommonJS和UMD 今天由于项目中引入的echarts的文件太大,requirejs经常加载超时,不得不分开来加载echarts的各个图表.但是使用echarts自带的在线构 ...
JS数组对象去重，ES6最简数组去重
JS数组对象去重,ES6最简数组去重 // 测试数据 // 比如我们处理 value 的去重 var arrList = [{key: 1, value: "aaa"},{key: ...

【JS】AMD，CMD，CommenJS和ES6

本节我们来对比一下AMD，CMD，CommenJS和ES6

【JS】AMD，CMD，CommenJS和ES6相关推荐

最新文章

热门文章