在 ES6 模块化中,我们可以使用 export
和 import
语句来导出和导入模块中的变量、函数、类等。在使用 export
语句时,有两种不同的语法形式:export
和 export default
。它们之间的区别如下:
export
语句可以导出多个变量、函数或类,而export default
语句只能导出一个默认的变量、函数或类。
例如,我们可以使用以下代码导出多个变量:Copy
// module.js
export const name = 'John';
export const age = 30;
在另一个模块中,我们可以使用以下代码导入这些变量:Copy
// app.js
import { name, age } from './module.js';
console.log(name); // 输出:John
console.log(age); // 输出:30
而如果我们使用 export default
语句,则只能导出一个默认的变量:Copy
// module.js
const name = 'John';
export default name;
在另一个模块中,我们可以使用以下代码导入这个变量:Copy
// app.js
import name from './module.js';
console.log(name); // 输出:John
- 在使用
import
语句导入模块时,可以省略export default
语句中的变量名,而不能省略export
语句中的变量名。
例如,我们可以使用以下代码导出一个默认的函数:Copy
// module.js
export default function() {
console.log('Hello World');
}
在另一个模块中,我们可以使用以下代码导入该函数:Copy
// app.js
import sayHello from './module.js';
sayHello(); // 输出:Hello World
在这个例子中,我们可以省略函数名称,因为该函数是一个默认的导出,而在 export
语句中,我们必须指定要导出的变量、函数或类的名称,否则无法正确导入。
总之,export
语句用于导出多个变量、函数或类,而 export default
语句用于导出一个默认的变量、函数或类。在导入模块时,可以省略 export default
语句中的变量名,但不能省略 export
语句中的变量名。