理解ES6中的模块
理解ES6中的模块（Modules）
ES6中的模块（Modules）是一种JavaScript原生支持的模块系统，它允许开发者将代码拆分为独立、可重用的片段，每个模块拥有自己的作用域。模块可以导出（export）和导入（import）变量、函数、类等，这使得代码的维护性和可读性大大提升。
核心特点：
- 作用域隔离：模块内部的变量和函数不会污染全局作用域。
- 严格模式：所有模块代码自动以严格模式执行，不需手动指定。
- 导入导出机制：使用
export导出功能，使用import引入所需模块。
使用方式：
-
导出（Export）：
- 命名导出：允许导出多个成员。
// utils.js export function add(a, b) { return a + b; } export const PI = 3.14; - 默认导出：每个模块只能有一个默认导出。
// math.js export default function multiply(a, b) { return a * b; }
- 命名导出：允许导出多个成员。
-
导入（Import）：
- 命名导入：需要精确匹配导出的名称。
import { add, PI } from './utils.js'; console.log(add(2, 3)); // 输出 5 console.log(PI); // 输出 3.14 - 默认导入：可以使用任意名称。
import multiply from './math.js'; console.log(multiply(2, 3)); // 输出 6
- 命名导入：需要精确匹配导出的名称。
使用场景：
- 代码模块化开发：当项目规模较大时，可以将功能拆分成多个模块，增强代码的可维护性和复用性。
- 前后端共享代码：在Node.js和前端环境中都可以使用模块化来组织代码。
- 打包工具（如Webpack、Parcel）结合使用：通过模块化，可以让打包工具有效管理依赖，优化项目构建。
ES6模块是JavaScript现代化开发的基础，替代了过去的全局变量和早期的模块系统（如CommonJS、AMD）。