未来的项目开发一定是模块化/组件化开发,因此对模块化开发有一定了解是非常有必要的。
-
单例设计模式
- 解决的问题:通过闭包解决了模块间变量相互冲突的问题。
- 弊端:需要手动分析模块间的依赖关系,要按顺序依次倒入相关模块;同时所有模块都是基于script导入的,使得页面HTTP请求变多。
-
AMD「require.js」 requirejs.org
- 与CommonJS不同,它采用的是异步的方式加载模块。require.js是AMD模块化规范的代表性体现。
- AMD解决了浏览器端CommonJS存在的问题,支持异步加载和并行加载依赖。
-
CommonJS模块规范
- 导出模块:module.exports = {...}或者module.exports = ...
- 导入模块: const xxx = require(模块地址(可以省略.js后缀))
- 缓存机制: CommonJS采用同步的方式加载模块。在服务端,模块文件都保留在磁盘上,因此加载速度很快。
-
ES6模块化规范
- 采用export/export default和import进行模块的导出和导入,是目前最好的模块化解决方案,但是无法直接在JS环境运行,需要转化为ES5代码后才能运行。
总结:本篇总结了模块化开发的发展历程,今后学习重点应为CommonJS和ES6模块化规范。