es6的模块化导入导出

ES6引入了现代模块系统，使得JavaScript代码的组织变得更加清晰和模块化。模块化通过`import`和`export`关键字实现了：

1. **导入（Importing）**：`import`用于从外部模块引入你需要的部分。例如，如果你有一个名为`math.js`的文件，你可以这样做：

   import { add, subtract } from './math.js'; // 引入特定函数

2. **导出（Exporting）**：`export`用于将模块的内部变量、函数或对象暴露给其他模块使用。有两种基本形式：
- `export default`：指定一个默认的导出项。

   export default function multiply(x, y) {
     return x * y;
   }

- 使用大括号`{}`声明多个导出：

   export const pi = 3.14;
   export function sqrt(num) {
     // ...
   }

相关问题

es6模块化和commonjs区别

ES6模块化（也称为ESM）和CommonJS是两种不同的模块化系统，它们在语法和使用方式上有一些区别。

1. 语法差异：
- ES6模块化：使用`import`和`export`关键字来导入和导出模块。
- CommonJS：使用`require()`函数来导入模块，使用`module.exports`或`exports`对象来导出模块。

2. 动态 vs 静态：
- ES6模块化：模块在编译时就确定了依赖关系，是静态的。这意味着导入和导出的模块路径必须是静态的，不能使用变量或表达式。
- CommonJS：模块在运行时加载和解析，是动态的。这意味着可以使用变量或表达式来动态地导入模块。

3. 加载方式：
- ES6模块化：通过`<script type="module">`标签直接在浏览器中加载，或使用构建工具（如Webpack）将模块打包为单个文件。
- CommonJS：主要用于服务器端，通过`require()`函数动态加载模块。

4. 导入方式：
- ES6模块化：可以按需导入模块中的具体内容，也可以整体导入。
- CommonJS：导入的是整个模块对象，需要通过对象属性访问具体内容。

需要注意的是，ES6模块化在现代浏览器和最新版本的Node.js中得到了广泛支持，而CommonJS主要用于旧版本的Node.js和一些服务器端应用程序。

es6的导入导出

ES6 中的模块化系统采用了 import 和 export 语句来实现模块的导入和导出。

1. 导出

使用 export 语句可以将一个模块中的变量、函数或类导出，以便其他模块可以使用它们。例如：

// 导出单个变量
export const name = 'Tom';

// 导出多个变量
const age = 18;
const gender = 'male';
export { age, gender };

// 导出函数
export function sayHello() {
  console.log('Hello!');
}

// 导出类
export class Person {
  constructor(name, age) {
    this.name = name;
    this.age = age;
  }
}

2. 导入

使用 import 语句可以从其他模块中导入变量、函数或类。例如：

// 导入单个变量
import { name } from './module.js';

// 导入多个变量
import { age, gender } from './module.js';

// 导入默认导出
import Person from './module.js';

// 导入所有导出
import * as module from './module.js';

其中，"./module.js" 是要导入的模块的路径，需要根据实际情况进行修改。

- 如果一个模块只有一个默认导出，可以使用 import default 语法直接导入默认导出。例如：`import Person from './module.js';`
- 如果一个模块有多个导出，可以使用 import * as 语法导入所有导出，然后通过 module.name、module.age 等语法来访问它们。例如：`import * as module from './module.js';`