模块化的基础概念

1. 什么是模块化？

  • 将程序文件依据一定的规则拆分成多个文件，这种编码方式就是模块化的编码方式。
  • 拆分出来的每个文件就是一个模块，模块中的数据都是私有的，模块之间相互隔离。
  • 同时也能通过一些手段，可以把模块内的指定数据交出去，供其它模块使用。
  • 像后端语言基本上都自带模块化，JS早期没有自带模块化，是NodeJS发展起来后，NodeJS加入了模块化后 ECMA 才加入模块化的。

2. 为什么需要模块化？

随着应用的复杂度越来越高，代码量和文件的数量都急剧增加，会逐渐引发下面的问题：

  • 全局污染问题 - 比如不同的人声明了相同名称的变量名和函数名，就会命名冲突
  • 依赖混乱问题 - 引入JS文件的顺序要手动调整，被依赖的一定要放前面，放错就会代码运行不起来
  • 数据安全问题 - 数据无法隐藏，会全部暴露出来。

3. 目前有哪些模块化规范？

历史背景

2009年，Node.js 出现，让JS不仅能做浏览器端运行，更能在服务器端运行， 随着JavaScrip 在服务器端的应⽤逐渐增多，为了让 Node.js 的代码更好维护，就必须要制定⼀种 Node.js 环境下的模块化规范，来⾃Mozilla 的⼯程师 Kevin Dangoor 提出了 CommonJS 规范（CommonJS 初期的名字叫 ServerJS, 因为NodeJS主要用于服务器端的开发），随后 Node.js 社区采纳了这⼀规范。

随着时间的推移，针对JavaScript 不同的运行环境，相继出现了多种模块化规范，下面是模块化的一些发展历程：

发展历程

  1. 无模块化阶段 —— （过）
  2. 命名空间模式 —— （过）
  3. IIFE模式 （立即执行函数表达式）—— （过）
  4. ComonJS(CJS) —— 服务器端应用广泛 （学）
  5. AMD （异步模块）—— 需要用到require.js这个库，导入导出都用define函数 （过）
  6. CMD —— 阿里搞的模块化，结合了CommonJS和AMD的语法 （过）
  7. UMD —— 也是社区搞的，因为CJS只能用于服务器端，所以搞个多端适用的UMD（过）
  8. ES6 模块化 —— 浏览器端应用广泛 （学）

4. 导入和导出的概念

概念

模块化的核心思想就是：模块之间是隔离的，通过导入和导出进行数据和功能的共享。

  • 导出（暴露）：模块公开其内部的一部分（如：变量、函数等），始这些内容可以被其他模块使用。
  • 导入（引入）： 模块引入并使用其他模块导出的内容，以重用代码和功能。