导入(import)和导出(export)总结

发布时间 2023-12-27 15:00:36作者: 小阿飞ZJF

当涉及到导入(import)和导出(export)的概念时,有两种常见的模块系统:ES6模块 和 CommonJS 模块。它们在语法和使用方式上有一些区别:

一、ES6模块

导出:使用`export`关键字将一个或多个函数、变量或对象导出为命名导出(named exports)或默认导出(default export)。

  • 命名导出:使用`export`关键字导出带有名称的函数、变量或对象。
  • 默认导出:使用`export default`关键字导出一个默认的函数、变量或对象。每个模块只能有一个默认导出。

导入:使用`import`语句来导入其他模块中的命名导出或默认导出。

  • 命名导入:使用`import { }`语法导入其他模块中的命名导出。需要指定要导入的具体名称。
  • 默认导入:使用`import`语法导入其他模块中的默认导出。导入的值可以用任何名称进行命名。

以下是ES6模块导入和导出的示例:

```javascript
// 导出
export function func1() { }
export const variable1 = 10;
export default function func2() { }

// 导入
import { func1, variable1 } from './module';
import func2 from './module';
```

CommonJS模块:
- 导出:使用`module.exports`将一个对象、函数或变量导出为默认导出。
- 导入:使用`require`语法导入其他模块中的默认导出。

以下是CommonJS模块导入和导出的示例:

```javascript
// 导出
module.exports = {
func1: function () { },
variable1: 10
};

// 导入
const module = require('./module');
const { func1, variable1 } = module;
```

综上所述,ES6模块和CommonJS模块在导入和导出的语法和使用方式上有一些差异。根据你的项目和代码使用的模块系统,你可以选择适合的导入和导出方式。