export 和 export default
时间: 2023-06-17 21:04:35 浏览: 93
ES6新特性:使用export和import实现模块化详解
在 ES6 中,我们可以使用 `export` 和 `export default` 来导出模块。它们的区别在于:
- `export` 可以导出多个变量、函数或对象,每个导出的变量都需要使用花括号 `{}` 括起来。例如:
```javascript
// 导出多个变量
export const a = 1;
export const b = 2;
// 导出一个函数
export function foo() {
// ...
}
// 导出一个对象
export const obj = { x: 1, y: 2 };
```
- `export default` 只能导出一个默认的变量、函数或对象,导入时不需要使用花括号 `{}`。例如:
```javascript
// 导出一个默认的变量
export default 42;
// 导出一个默认的函数
export default function() {
// ...
}
// 导出一个默认的对象
export default { x: 1, y: 2 };
```
当我们需要导入某个模块时,可以使用 `import` 语句来导入模块。例如:
```javascript
// 导入 export 导出的模块
import { a, b, foo, obj } from './module';
// 导入 export default 导出的模块
import defaultValue from './module';
```
需要注意的是,使用 `export` 和 `export default` 导出的模块,只能被 ES6 或以上版本的 JavaScript 引擎所解析。如果需要在低版本的浏览器中使用,需要使用其他的模块加载器,例如 RequireJS 或 Browserify。
阅读全文