在JavaScript ES6的模块系统中,export 和 export default 都是用来导出模块中对外可见的变量、函数、类或对象的语法,但是它们的作用和使用方式有所不同:
export
export 关键字用于导出模块中的多个命名输出,每个导出项都有一个名称,外部模块可以通过这个名称来导入:
// module1.js
export const pi = 3.14159;
export function calculateArea(radius) {
return pi * radius * radius;
}
导入时需指定导出的名称
// main.js
import { pi, calculateArea } from './module1.js';
console.log(pi); // 输出3.14159
console.log(calculateArea(2)); // 输出12.56636
export default
export default 用于导出模块的默认输出,一个模块只能有一个默认输出。导入时不需指定名称,可以根据需要自行命名
// module2.js
export default function add(a, b) {
return a + b;
}
导入时可以任意命名
// main.js
import sum from './module2.js'; // 可以命名为sum,也可以是其他任何名称
console.log(sum(3, 5)); // 输出8
export 和 export default都使用
如果模块同时使用了 export 和 export default,那么可以混合导入
// module3.js
export const number = 42;
export default function multiply(a, b) {
return a * b;
}
// main.js
import multiply, { number } from './module3.js';
console.log(number); // 输出42
console.log(multiply(3, 5)); // 输出15