CommonJS、AMD、CMD、ES6

36 阅读2分钟

介绍

CommonJS规范的提出,主要是为了弥补JavaScript没有标准的缺陷,已达到像Python、Ruby和Java那样具备开发大型应用的基础能力,而不是停留在开发浏览器端小脚本程序的阶段。模块规范主要分为三部分:模块引用、模块定义、模块标识。 同时,模块规范很好地解决变量污染问题,每个模块具有独立空间,互不干扰,命名空间等方案与之相比相形见绌。模块规范支持引入和导出功能,这样可以顺畅地连接各个模块,实现彼此间的依赖关系。

AMD、CMD、ES6规范则继CommonJS规范之后逐渐诞生,因为CommonJS规范更适合服务器端,而其他三种则更好的适用于浏览器端。

区别

CommonJS规范

2009年,美国程序员Ryan Dahl创造了node.js项目,将javascript语言用于服务器端编程。这标志”Javascript模块化编程”正式诞生。

  • 同步异步:同步
  • 实现实例: nodejs
  • 运行环境:服务端
  • 引入模块 -------require('模块路径')
  • 导出模块 ------ exports.模块名= function(){ //some code ... }

AMD----- 依赖前置 (require.js)

  • 同步异步:异步
  • 实现实例: Requirejs
  • 运行环境:浏览器端
  • 引入模块-----require([ ],callback)
  • 定义模块----- define([],callback)

不论定义模块,还是引入模块时,都会先行引入依赖,再定义/引入模块

CMD ----- 依赖就近引入原则(seaJs)

CMD (Common Module Definition), 是seajs推崇的规范,CMD则是依赖就近,用的时候再require

  • 同步异步:异步
  • 实现实例: Seajs
  • 运行环境:浏览器端
  • 引入模块 (遵循就近原则)
define(function(require, exports, module) {
        var clock = require('clock');
        clock.start();
});
  • 定义模块----- define([],callback)
define(id?, dependencies?, factory)
//id:字符串,模块名称(可选)
//dependencies: 是我们要载入的依赖模块(可选),使用相对路径。,注意是数组格式
//factory: 工厂方法,返回一个模块函数
define('hello', ['jquery'], function(require, exports, module) {
   // 模块代码
   //不依赖其他模块时的写法: 
   // define(function(require, exports, module) {
 });

ES6

Es6标准发布后,成为module标准:使用export指令导出接口,import引入模块,但是在node模块中,我们依然使用CommonJS规范,(require引入模块,module.exports导出接口)

  • 同步异步:异步
  • 实现实例: Javascript
  • 运行环境:前后端
  • 引入模块 ----- import
  • 定义模块 ----- export、export default