随着前端开发的演进，ES6 引入了模块化系统，彻底改变了代码组织方式。相比传统的全局变量污染，模块化让代码更清晰、可维护性更强。那么，什么是 ES6 模块呢？简单来说，它是一种通过 `import` 和 `export` 来导入导出功能的方式。

首先，让我们看看如何使用 export 导出

```javascript

// math.js

export const add = (a, b) => a + b;

export const subtract = (a, b) => a - b;

```

然后用 import 引入：

```javascript

// main.js

import { add, subtract } from './math.js';

console.log(add(5, 3)); // 输出: 8

console.log(subtract(5, 3)); // 输出: 2

```

此外，还有两种特殊用法：

- 使用 ` as` 导入所有

```javascript

import as MathUtils from './math.js';

console.log(MathUtils.add(10, 10));

```

- 使用默认导出（一个文件只能有一个）：

```javascript

// utils.js

export default function() {

console.log('Default Function');

}

```

通过模块化，代码结构更加清晰，团队协作也更高效！✨

前端 JavaScript ES6