CommonJS: 第一个流行的模块化规范由服务器端的JavaScript应用带来,CommonJS规范由NodeJS发扬光大。CommonJS 用同步的方式加载模块;在服务端,模块文件都存放在本地磁盘,读取非常快,所以这样做不会有问题。但是在浏览器端,限于网络原因,更合理的方案是使用异步加载。于是就有了AMD\CMD。
AMD: AMD 即Asynchronous Module Definition异步模块定义,典型的代表是requirejs
CMD: CMD 即Common Module Definition通用模块定义,典型的代表是seajs。
Requirejs和seajs解决的问题:
1.多个js文件可能有依赖关系,被依赖的文件需要早于依赖它的文件加载到浏览器
2.js加载的时候浏览器会停止页面渲染,加载文件越多,页面失去响应时间越长
两者的不同之处在于,模块定义方式和模块加载(可以说运行、解析)时机上有所不同:
1.AMD推崇依赖前置,在定义模块的时候就要声明其依赖的模块
2.CMD推崇就近依赖,只有在用到某个模块的时候再去require
AMD和CMD最大的区别是对依赖模块的执行时机处理不同。AMD在模块加载模块完成之后就会执行该模块,当所有依赖模块加载执行完成之后进入主逻辑回调函数。而CMD加载模块只是下载而已不会立即执行,在所有依赖模块加载完成后进入主逻辑回调函数;遇到require语句的时候才执行对应的模块,这样模块的执行顺序和书写顺序是完全一致的。
AMD推崇依赖前置、提前执行,CMD推崇依赖就近、延迟执行 UMD ( Universal Module Definition- 通用模块定义 )是AMD和CommonJS的一个糅合。AMD是浏览器优先,异步加载;CommonJS是服务器优先,同步加载。****
既然要通用,怎么办呢?那就先判断是否支持node.js的模块,存在就使用node.js;再判断是否支持AMD(define是否存在),存在则使用AMD的方式加载。这就是所谓的UMD。
ESM ES6 在语言标准的层面上,实现了模块功能,而且实现得相当简单,旨在成为浏览器和服务器通用的模块解决方案。其模块功能主要由两个命令构成:export和import。export命令用于规定模块的对外接口,import命令用于输入其他模块提供的功能。
CommonJS 模块输出的是一个值的拷贝,ES6 模块输出的是值的引用