JavaScript 模块化有多种规范，包括 CommonJS (CJS)、ES Modules (ESM)、AMD、UMD 等。
- CommonJS (CJS)：同步加载模块，通常在服务器端使用，如 Node.js。
// math.js
exports.add = function(a, b) {
return a + b;
};
// 使用模块
const math = require('./math.js');
console.log(math.add(1, 2)); // 输出: 3- ES Modules (ESM)：异步加载模块，是现代浏览器和服务器端的主要模块解决方案。
// math.js
export function add(a, b) {
return a + b;
}
// 使用模块
import { add } from './math.js';
console.log(add(1, 2)); // 输出: 3- AMD (Asynchronous Module Definition)：异步模块定义，主要用于浏览器环境，如 RequireJS。
// math.js
define(function() {
return {
add: function(a, b) {
return a + b;
}
};
});
// 使用模块
require(['./math'], function(math) {
console.log(math.add(1, 2)); // 输出: 3
});- UMD (Universal Module Definition)：兼容 CommonJS 和 AMD 的模块定义，可以同时在这两个环境中工作。
(function(factory) {
if (typeof define === 'function' && define.amd) {
// AMD
define(['jquery'], factory);
} else if (typeof exports === 'object') {
// CommonJS
module.exports = factory(require('jquery'));
} else {
// 浏览器全局变量
window.myModule = factory(window.jQuery);
}
}(function($) {
// 模块代码
function myFunc() {
// ...
}
return myFunc;
}));在现代前端开发中，通常使用 ES Modules，因为它是官方标准，并且是异步加载的，非常适合现代浏览器和服务器端。