AMD(Asynchronous Module Definition)
模块的依赖是在定义模块时就声明好的,并且作为参数传入模块的工厂函数。这意味着所有的依赖都需要在模块体开始执行之前被加载。
(function(global) {
var modules = {}; // 用于存储定义的模块
// 定义模块
function define(name, dependencies, factory) {
if (!modules[name]) { // 避免重复定义
// 保存模块,包括依赖和模块工厂函数
modules[name] = {
dependencies: dependencies,
factory: factory,
module: { exports: {} },
isLoaded: false
};
}
}
// 加载模块
function require(names, callback) {
var requiredModules = names.map(function(name) {
return loadModule(name);
});
callback.apply(null, requiredModules);
}
// 加载单个模块
function loadModule(name) {
var module = modules[name];
if (!module) {
throw new Error('Module ' + name + ' not found');
}
if (!module.isLoaded) {
// 加载依赖
var dependencies = module.dependencies.map(function(dependencyName) {
return loadModule(dependencyName);
});
// 调用工厂函数,传入依赖
var exports = module.factory.apply(null, dependencies);
if (exports) {
module.module.exports = exports;
}
module.isLoaded = true;
}
return module.module.exports;
}
// 暴露全局变量
global.define = define;
global.require = require;
})(this);
// 使用示例
// 定义模块
define('module1', [], function() {
return {
hello: function() {
return 'Hello Module 1';
}
};
});
// 使用模块
require(['module1'], function(module1) {
console.log(module1.hello()); // 输出: Hello Module 1
});
CMD(Common Module Definition)
模块的依赖更倾向于被按需加载,即在模块体内部的任何地方通过require方法来获取,只有当模块真正需要某个依赖时,才去加载该依赖。
(function(global) {
var modules = {}; // 存储定义的模块
// 定义模块
function define(id, factory) {
if (!modules[id]) { // 避免重复定义
modules[id] = {
factory: factory,
exports: null, // 模块的导出对象,初始为null
initialized: false // 标记模块是否已被初始化
};
}
}
// 加载模块
function require(id) {
var module = modules[id];
if (!module) {
throw new Error('Module ' + id + ' not found');
}
// 如果模块尚未初始化,则初始化模块
if (!module.initialized) {
// 调用模块工厂函数,初始化模块
module.exports = {};
var exports = module.factory.call(null, require, module.exports) || module.exports;
module.exports = exports;
module.initialized = true;
}
return module.exports;
}
// 暴露全局变量
global.define = define;
global.require = require;
})(this);
// 使用示例
// 定义模块
define('exampleModule', function(require, exports) {
// 模块内容
exports.sayHello = function() {
return 'Hello, CMD!';
};
});
// 加载并使用模块
var example = require('exampleModule');
console.log(example.sayHello()); // 输出: Hello, CMD!
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用
。你还可以使用@
来通知其他用户。