MST

星途 面试题库

面试题:TypeScript装饰器在元编程与AOP方面的深度应用

结合元编程和面向切面编程(AOP)的概念,利用TypeScript装饰器实现一个功能:能够在不修改原有业务逻辑代码的前提下,为类的所有方法添加性能监控功能,记录每个方法的执行时间,并将这些性能数据发送到一个远程服务器进行分析。请阐述实现思路并给出关键代码示例。
20.6万 热度难度
前端开发TypeScript

知识考点

AI 面试

面试题答案

一键面试

实现思路

  1. 元编程:TypeScript 的装饰器是元编程的一种形式,它允许我们在类、方法、属性等定义时添加额外的逻辑。
  2. 面向切面编程(AOP):通过装饰器,我们可以将性能监控这个横切关注点从业务逻辑中分离出来,实现 AOP。
  3. 性能监控:在方法执行前后记录时间戳,计算执行时间。
  4. 数据发送:使用 fetch 或其他 HTTP 库将性能数据发送到远程服务器。

关键代码示例

// 定义装饰器
function performanceMonitor(target: any, propertyKey: string, descriptor: PropertyDescriptor) {
    const originalMethod = descriptor.value;
    descriptor.value = async function (...args: any[]) {
        const startTime = new Date().getTime();
        const result = await originalMethod.apply(this, args);
        const endTime = new Date().getTime();
        const executionTime = endTime - startTime;
        // 发送数据到远程服务器
        sendPerformanceData(propertyKey, executionTime);
        return result;
    };
    return descriptor;
}

// 发送性能数据到远程服务器的函数
async function sendPerformanceData(methodName: string, executionTime: number) {
    const data = { methodName, executionTime };
    try {
        await fetch('远程服务器地址', {
            method: 'POST',
            headers: {
                'Content-Type': 'application/json'
            },
            body: JSON.stringify(data)
        });
    } catch (error) {
        console.error('发送性能数据失败:', error);
    }
}

// 使用装饰器
class MyService {
    @performanceMonitor
    async myMethod() {
        // 模拟业务逻辑
        await new Promise(resolve => setTimeout(resolve, 1000));
        return '方法执行结果';
    }
}

// 使用示例
const service = new MyService();
service.myMethod().then(result => console.log(result));