对比CommonJS、AMD、CMD、ES6模块

CommonJS

通过 require 来引入模块，通过 module.exports 定义模块的输出接口。是服务器端（Node.js）的解决方案，它是以同步的方式来引入模块的，因为在服务端文件都存储在本地磁盘，所以读取非常快，所以以同步的方式加载没有问题。但如果是在浏览器端，由于模块的加载是使用网络请求，因此使用异步加载的方式更加合适。

AMD

通过定义模块和依赖关系来实现模块的异步加载和执行。它采用了回调函数的方式来处理模块加载完成后的逻辑 。是浏览器端的解决方案。

• 使用 define()来定义模块。define 函数接受三个参数：模块的名称、依赖数组和工厂函数。
• 使用 require()来加载并使用模块。require 函数接受两个参数：依赖数组和回调函数

define('math', ['jquery'], function($) {
  // 在模块内部可以使用传入的依赖模块
  return {
    add: function(a, b) {
      return a + b;
    },
    multiply: function(a, b) {
      return a * b;
    }
  };
});

require(['math'], function(math) {
  console.log(math.add(2, 3)); // 输出：5
});

CMD

CMD 方案的核心思想是延迟执行，CMD 方案在模块定义时不会立即执行模块的代码，而是等到模块被调用时再执行。是浏览器端的解决方案。

• 使用define() 来定义模块
• 使用require() 来加载模块

define(function(require, exports, module) {
  var $ = require('jquery'); // 加载依赖模块
  // 在模块内部可以使用传入的依赖模块
  exports.add = function(a, b) {
    return a + b;
  };
  exports.multiply = function(a, b) {
    return a * b;
  };
});

define(function(require) {
  var math = require('math'); // 加载模块
  console.log(math.add(2, 3)); // 输出：5
});

ES6模块

ES6导入和导出都是静态的，意味着它们在代码解析阶段就确定了，这也意味着 ES6 模块的加载是同步的，而不是异步的。可以用于在浏览器端和服务器端（Node.js） 进行模块化开发。

1. import 和 export 关键字用于定义模块的导入和导出。
2. 导入和导出的都是模块中具体的变量、函数或类，而不是整个模块。
3. 模块中的变量具有封闭性，不会随意污染全局变量。
4. 所有导入的模块都会被编译成一个静态结构，便于分析和优化。

// 导出 add 方法
export function add(a, b) {
  return a + b;
}

// 导入并使用 "math" 模块
import { add } from './math.js';
console.log(add(2, 3)); // 输出：5

注意：在服务器端CommonJS模块输出的是一个值的拷贝，ES6模块输出的是值的引用