面试题：TypeScript方法装饰器优化性能在复杂业务场景的应用

设计思路

方法装饰器基础：方法装饰器可以在不改变原方法实现的情况下，对方法进行额外操作。在性能优化场景中，可用于在方法执行前后记录时间、控制缓存等。
性能监控：通过记录方法执行的开始和结束时间，计算方法执行耗时，以便发现性能瓶颈。
缓存控制：根据业务场景，对频繁调用且结果相对稳定的方法，通过装饰器实现缓存机制，避免重复计算。

关键代码示例

// 性能监控装饰器
function performanceMonitor(target: any, propertyKey: string, descriptor: PropertyDescriptor) {
    const originalMethod = descriptor.value;
    descriptor.value = function(...args: any[]) {
        const start = Date.now();
        const result = originalMethod.apply(this, args);
        const end = Date.now();
        console.log(`${propertyKey} 方法执行耗时: ${end - start} ms`);
        return result;
    };
    return descriptor;
}

// 缓存装饰器
function cache(target: any, propertyKey: string, descriptor: PropertyDescriptor) {
    const originalMethod = descriptor.value;
    const cacheMap = new Map();
    descriptor.value = function(...args: any[]) {
        const key = args.toString();
        if (cacheMap.has(key)) {
            return cacheMap.get(key);
        }
        const result = originalMethod.apply(this, args);
        cacheMap.set(key, result);
        return result;
    };
    return descriptor;
}

class UserService {
    @performanceMonitor
    @cache
    getUserPermissions(userId: number) {
        // 模拟复杂业务逻辑，例如从服务器获取用户权限
        return `用户 ${userId} 的权限信息`;
    }
}

const userService = new UserService();
console.log(userService.getUserPermissions(1));
console.log(userService.getUserPermissions(1));

代码说明

performanceMonitor装饰器：在方法执行前记录开始时间，执行后记录结束时间，并计算输出耗时。
cache装饰器：使用 Map 来存储方法调用的结果，当相同参数再次调用时，直接从缓存中返回结果，避免重复执行方法。
UserService类：getUserPermissions 方法应用了 performanceMonitor 和 cache 装饰器，实现性能监控和缓存功能，在实际大型前端项目的用户权限管理场景中，可有效提升性能。

星途面试题库

面试题：TypeScript方法装饰器优化性能在复杂业务场景的应用

知识考点

面试题答案

设计思路

关键代码示例

代码说明