面试题：TypeScript模块化中默认导出与具名导出的区别

Question

在TypeScript模块化里，阐述默认导出（default export）和具名导出（named export）的具体区别，并且分别举例说明如何使用这两种导出方式，以及在导入时的不同写法。

Answer 1

默认导出（default export）

1. 区别：
   • 每个模块只能有一个默认导出。它常用于导出一个模块的主要功能或值，在导入时可以使用任意标识符。
2. 导出示例：

   // 定义一个函数
   const greet = (name: string) => {
       return `Hello, ${name}!`;
   };
   // 默认导出函数
   export default greet;
   

3. 导入示例：

   // 导入默认导出的函数，这里使用myGreet作为标识符
   import myGreet from './greetModule';
   console.log(myGreet('John'));
   

具名导出（named export）

1. 区别：
   • 一个模块可以有多个具名导出。具名导出的标识符在导入时必须准确匹配（可以通过别名导入），常用于导出多个相关的功能或值。
2. 导出示例：

   // 具名导出函数
   export const add = (a: number, b: number) => {
       return a + b;
   };
   // 具名导出变量
   export const PI = 3.14159;
   

3. 导入示例：
   • 完整导入：

   import {add, PI} from './mathModule';
   console.log(add(2, 3));
   console.log(PI);
   

   • 别名导入：

   import {add as sum, PI as piValue} from './mathModule';
   console.log(sum(2, 3));
   console.log(piValue);