TypeScript 外部模块
介绍
在 TypeScript 中,外部模块(External Modules)是一种将代码分割成多个文件的方式,使得代码更易于管理和维护。外部模块允许我们将相关的功能组织在一起,并通过导入(import
)和导出(export
)机制在文件之间共享代码。
外部模块是 TypeScript 中实现模块化的核心方式,它与 JavaScript 的模块系统(如 CommonJS 或 ES Modules)兼容。通过使用外部模块,我们可以将大型项目分解为更小、更易管理的部分。
外部模块的基本概念
1. 导出(Export)
在 TypeScript 中,我们可以使用 export
关键字将变量、函数、类或接口等暴露给其他模块使用。例如:
// mathUtils.ts
export function add(a: number, b: number): number {
return a + b;
}
export const PI = 3.14;
在上面的代码中,add
函数和 PI
常量被导出,其他模块可以导入并使用它们。
2. 导入(Import)
要使用其他模块导出的内容,我们需要使用 import
关键字。例如:
// main.ts
import { add, PI } from './mathUtils';
console.log(add(2, 3)); // 输出: 5
console.log(PI); // 输出: 3.14
在上面的代码中,我们从 mathUtils.ts
模块中导入了 add
函数和 PI
常量,并在 main.ts
中使用它们。
默认导出与命名导出
1. 命名导出(Named Exports)
命名导出允许我们导出多个值,每个值都有一个名称。例如:
// mathUtils.ts
export function add(a: number, b: number): number {
return a + b;
}
export function subtract(a: number, b: number): number {
return a - b;
}
在导入时,我们需要使用花括号 {}
来指定要导入的内容:
import { add, subtract } from './mathUtils';
2. 默认导出(Default Export)
默认导出允许我们导出一个模块的主要功能。每个模块只能有一个默认导出。例如:
// logger.ts
export default function log(message: string): void {
console.log(message);
}
在导入时,我们可以为默认导出的内容指定任意名称:
import myLogger from './logger';
myLogger('Hello, TypeScript!');
默认导出通常用于模块的主要功能,而命名导出则用于辅助功能或工具函数。
模块解析与路径
TypeScript 支持多种模块解析策略,包括相对路径、绝对路径以及 Node.js 的模块解析规则。例如:
- 相对路径:
import { add } from './mathUtils';
- 绝对路径:
import { add } from 'src/utils/mathUtils';
- Node.js 模块:
import fs from 'fs';
确保模块路径正确,否则 TypeScript 会报错。如果使用第三方库,请确保已安装相应的类型定义文件(@types
)。
实际应用场景
场景 1:组织工具函数
假设我们有一个工具函数库,包含多个与数学相关的函数。我们可以将这些函数放在一个模块中:
// mathUtils.ts
export function add(a: number, b: number): number {
return a + b;
}
export function subtract(a: number, b: number): number {
return a - b;
}
export function multiply(a: number, b: number): number {
return a * b;
}
然后在其他模块中使用这些函数:
// main.ts
import { add, subtract, multiply } from './mathUtils';
console.log(add(2, 3)); // 输出: 5
console.log(subtract(5, 2)); // 输出: 3
console.log(multiply(2, 3)); // 输出: 6
场景 2:使用第三方库
在 TypeScript 中,我们可以轻松地使用第三方库。例如,使用 lodash
库:
import _ from 'lodash';
const numbers = [1, 2, 3, 4, 5];
const sum = _.sum(numbers);
console.log(sum); // 输出: 15
总结
TypeScript 的外部模块是一种强大的工具,可以帮助我们更好地组织和管理代码。通过使用 export
和 import
,我们可以将代码分割成多个模块,从而提高代码的可读性、可维护性和可扩展性。
- 命名导出:用于导出多个值。
- 默认导出:用于导出模块的主要功能。
- 模块解析:支持相对路径、绝对路径和 Node.js 模块。
附加资源与练习
资源
练习
- 创建一个名为
stringUtils.ts
的模块,导出以下函数:reverseString(str: string): string
:返回字符串的反转。capitalize(str: string): string
:将字符串的首字母大写。
- 在
main.ts
中导入并使用这些函数。