浅谈amd与cmd的作用与区别

浅谈AMD与CMD的作用与区别

1. AMD和CMD的概述

AMD和CMD都是JavaScript的模块加载器。在ES6出现之前，JavaScript是没有官方的模块化标准的，但由于JavaScript已经成为应用非常广泛的语言，因此有人在此基础上对它进行了扩展，对于在此时期的JavaScript开发者来说，AMD和CMD就是他们首选的模块加载器之一。

AMD (Asynchronous Module Definition) 异步模块定义，主要应用于浏览器中，它提前加载依赖的模块，但是不执行，等到依赖的模块都加载完成后，按照依赖顺序执行模块。

CMD(Common Module Definition) 通用模块定义，同样适用于浏览器和Node环境下，与AMD不同的是，它推崇的是依赖就近，需要用到某个模块时再去加载它。

2. AMD和CMD的区别

AMD和CMD的最大的区别就是对于依赖模块的处理方式不同。AMD会提前加载依赖模块，然后在代码运行的过程中需要用到某个模块时再去执行，而CMD则是当代码需要加载某个模块时再去加载依赖模块，它的依赖模块加载方式类似CommonJS。

除此之外，还有一些其他的细微差别。比如AMD需要通过define来定义模块，而CMD则是通过exports来导出模块；AMD的模块返回值可以是任何值，而CMD则只能是对象；AMD的依赖模块定义中的路径必须指定，而CMD则可以不指定默认加载与当前模块同一目录下的同名文件。

3. AMD和CMD的示例说明

3.1 AMD示例说明

define(['module1', 'module2'], function(m1, m2){
  function doSomething(){
    m1.doSomeFunction();
    m2.doAnotherFunction();
  }
  return {
    doSomething: doSomething
  }
});

以上代码定义了一个名为doSomething的函数。它依赖于module1和module2两个模块。只有这两个模块都加载完成之后，就会按照依赖顺序执行这个函数。

3.2 CMD示例说明

define(function(require, exports, module) {
  var m1 = require('module1');
  var m2 = require('module2');

  function doSomething() {
    m1.doSomeFunction();
    m2.doAnotherFunction();
  }
  exports.doSomething = doSomething;
});

以上代码与前面的AMD示例非常相似，但是它使用的是CMD。在这里，我们通过require来引入模块，然后再导出函数。需要用到某个模块时再去加载它，这也是CMD最大的特点之一。

总结

AMD和CMD都是目前前端工程化开发中非常常用的模块加载器，它们的存在让开发者可以使用模块化的思想组织代码，从而更加容易维护和扩展。此外，AMD和CMD虽然有一些区别，但是它们都能满足我们大部分的模块化开发需求。