面试题：TypeScript外部模块的最佳实践

Question

在一个大型TypeScript项目中，如何合理地组织和使用外部模块以提高代码的可维护性与可扩展性，请结合实际项目经验举例说明。

Answer 1

1. 模块组织原则

• 功能划分：根据功能将代码划分为不同的模块。例如，在一个电商项目中，将用户相关功能（注册、登录、信息修改等）放在user模块，商品相关功能（商品展示、添加到购物车、下单等）放在product模块。这样每个模块职责明确，便于维护和扩展。
• 单一职责：每个模块只负责一项主要功能。以一个文件上传模块为例，它只专注于处理文件的选择、上传、进度跟踪等与文件上传直接相关的操作，不涉及其他无关功能，如用户认证等。

2. 使用命名空间和模块化导入

• 命名空间：在大型项目中，使用命名空间避免全局命名冲突。假设项目中有多个工具类，将它们放在Utils命名空间下。

namespace Utils {
    export function formatDate(date: Date) {
        // 日期格式化逻辑
    }
    export function generateUUID() {
        // UUID生成逻辑
    }
}

• 模块化导入：使用import语句导入模块。在需要使用上述Utils功能的文件中：

import { formatDate, generateUUID } from './utils';
// 使用导入的函数
const formattedDate = formatDate(new Date());
const uuid = generateUUID();

3. 依赖管理

• 使用工具管理依赖：借助npm或yarn管理项目的外部依赖。例如，项目中使用axios进行HTTP请求，通过npm install axios安装，然后在package.json文件中记录其版本信息。这样在团队协作或部署时，能保证所有人使用相同版本的依赖。
• 避免循环依赖：例如，模块A依赖模块B，模块B又依赖模块A，这会导致难以调试和维护的问题。若出现这种情况，分析两个模块的功能，将公共部分提取到一个新的模块C，让A和B都依赖C。

4. 模块导出

• 默认导出与命名导出结合：对于一个模块只有一个主要的导出内容，如一个类或一个函数，可以使用默认导出。例如，一个UserService类：

class UserService {
    // 服务相关方法
}
export default UserService;

在其他文件中导入：

import UserService from './userService';
const userService = new UserService();

对于多个相关的导出内容，使用命名导出。例如，一个包含多个工具函数的mathUtils模块：

export function add(a: number, b: number) {
    return a + b;
}
export function subtract(a: number, b: number) {
    return a - b;
}

在其他文件中导入：

import { add, subtract } from './mathUtils';
const sum = add(2, 3);
const difference = subtract(5, 3);