JavaScript：export 和 export default

在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