模块化规范 | 核心思想 | 模块定义与引用 | 优点 | 缺点 |
---|---|---|---|---|
无模块化 | script标签引入js文件,顺序加载,相互罗列,但是被依赖的放在前面,否则使用就会报错。 | – | 污染全局作用域 维护成本高 依赖关系不明显 | |
CommonJS规范和node.js | 同步加载 | 模块定义:exports 或module.exports 模块加载: require('module') | 解决了依赖、全局变量污染的问题 | (1)不能并行加载模块,会阻塞浏览器加载; (2)代码无法直接运行在浏览器环境下,必须通过工具转换成标准的 ES5; |
AMD和require.js | 异步加载:依赖前置、提前执行 | 模块定义:define('module', ['dep'], function (dep) { return exports; }) ;模块加载: require(['module'], function (module) { }); | 适合在浏览器环境中异步加载模块、并行加载多个模块 | 不能按需加载、开发成本大 |
CMD和sea.js | 异步加载,依赖就近、延迟执行 | 模块定义:define(function (require, exports, module) { // 模块代码 }); 模块加载: seajs.use(['math.js'], function (math) { var sum = math.add(1, 2); }) | 按需加载,依赖就近、延迟执行, | |
ES6 | 异步加载 异步执行, | 模块定义:export/export default 模块加载: import | 在语言标准的层面上,实现模块功能且实现简单 | 浏览器还没有完全兼容,必须通过工具转换成标准的 ES5 后才能正常运行。 |
【JavaScript】CommonJS\AMD\CMD\ES6 一览表
最新推荐文章于 2022-11-10 10:39:15 发布