什么是模块化？
模块化是将代码分割成独立的、可重用的部分（模块），每个模块负责特定的功能。这样做的好处包括：
- 提高可读性：将复杂的代码分解为小块，使其更易于理解。
- 增强可维护性：修改一个模块不会影响其他模块，降低了出错的概率。
- 促进重用性：可以在不同项目中重用相同的模块，减少重复代码。
Export：导出模块
在JavaScript中，使用export关键字可以将模块中的变量、函数或类导出，以便在其他模块中使用。export有两种主要形式：命名导出和默认导出。
1. 命名导出
命名导出允许你导出多个变量或函数。示例如下：
// math.js
export const PI = 3.14;
export function add(x, y) {
return x + y;
}
在上面的代码中，我们导出了一个常量PI和一个函数add。在其他模块中，可以通过相同的名称导入这些导出：
// app.js
import { PI, add } from './math.js';
console.log(PI); // 3.14
console.log(add(2, 3)); // 5
2. 默认导出
默认导出允许你导出一个单一的值或对象。示例如下：
// calculator.js
export default function multiply(x, y) {
return x * y;
}
在其他模块中，你可以使用任意名称导入默认导出：
// app.js
import multiply from './calculator.js';
console.log(multiply(2, 3)); // 6
Import：导入模块
使用import关键字可以引入其他模块的导出。根据导出的类型，import的语法也有所不同。
1. 导入命名导出
import { PI, add } from './math.js';
2. 导入默认导出
import multiply from './calculator.js';
3. 导入所有导出
如果你想导入一个模块的所有导出，可以使用* as语法：
import * as math from './math.js';
console.log(math.PI); // 3.14
console.log(math.add(2, 3)); // 5
注意事项：
- 文件扩展名： 在
import语句中，通常需要指定文件的扩展名（例如.js）。 - 模块解析： JavaScript 运行时环境需要能够找到并加载模块。这通常涉及到模块解析算法，它会根据配置的规则查找模块文件。
- ES Modules vs. CommonJS：
import和export是 ES Modules 的语法。CommonJS 使用require()和module.exports。 现代 JavaScript 开发更倾向于使用 ES Modules。
