ES6 Module：使用场景与实际项目应用

ES6 中的 Module（模块） 概述

ES6 中引入了 模块化 的概念，使得 JavaScript 代码可以按功能进行拆分、组织和管理。模块化的引入是为了更好地支持大型项目的开发，避免全局变量污染、模块间依赖复杂性，以及提高代码的可维护性和复用性。

模块化通过 import 和 export 关键字来实现，它可以让我们在不同的文件之间共享代码。与传统的 JavaScript（没有模块系统）相比，ES6 模块化提供了更加清晰的结构和依赖管理方式。

ES6 模块的基本语法

1. 导出（Export）

• 命名导出：允许从一个模块中导出多个对象，可以分别导入。

  // math.js
  export const add = (a, b) => a + b;
  export const subtract = (a, b) => a - b;
  

• 默认导出：一个模块只能有一个默认导出，它允许导出一个值、对象或函数。

  // utils.js
  export default function greet(name) {return `Hello, ${name}!`;
  }
  

2. 导入（Import）

• 导入命名导出：通过 import 从模块中导入具体的命名成员。

  // app.js
  import { add, subtract } from './math.js';
  console.log(add(1