javascript - 使用 Promise 或回调时，装饰器函数返回未定义

Question

我正在尝试在节点js中创建一个装饰器来记录函数执行时的进入和退出，例如使用参数 5,1 执行 ServiceClass.sampleService然后执行完成后 ServiceClass.sampleService 的执行已成功/错误完成

这对于返回数字、字符串、数组或某些对象文字的普通函数来说效果很好，但是当我想装饰一个返回 Promise 或回调的函数时，它会记录详细信息，但在调用函数时不会返回值。

这是我的示例代码:

logger.ts(包含装饰器函数)

export function performanceLog(target, name, descriptor) {
    const original = descriptor.value;
    if (typeof original === 'function') {
        descriptor.value = function (...args) {
            console.log(`Executing ${target.constructor.name}.${name} with parameters ${args}`);
            // Execute function like a function with promise
            let start: any = new Date();
            return original.apply(this, args).then(data => {
                let end: any = new Date();
                end = end-start;
                console.log(`\nExecution of ${target.constructor.name}.${name} completed successfully in ${end / 1000} seconds`);
            }).catch(error => {
                let end: any = new Date();
                end = end-start;
                console.log(`\nExecution of ${target.constructor.name}.${name} completed with error in ${end / 1000} seconds`);
            });
        }
    }
    return descriptor;
}

sampleService.ts(常规服务类)

import { performanceLog } from '../utilities/logger';

let err = false;
export default class SampleService {
    @performanceLog
    public sum(a, b) {
        return new Promise((resolve, reject) => {
            if (err) {
                reject(a - b);
            } else {
                resolve(a + b);
            }
        })
    }
}

const e = new SampleService();
e.sum(51, 6).then(data => console.log("## Data: ", data)).catch(err => console.log("##err: ", err));
// Here data is undefined and it never goes into the catch part either

我在这里缺少什么？

编辑

当我有一个返回回调函数的函数时，会出现类似的问题

export default class SampleService {
    @performanceLog
    public sum(a, b, callback) {
        // return new Promise((resolve, reject) => {
        if (err) {
            return callback(a - b, null);
        } else {
            return callback(null, a+b);
        }
        // })
    }
}

const e = new SampleService();
// e.sum(51, 6).then(data => console.log("## Data: ", data)).catch(err => console.log("##err: ", err));

e.sum(51, 6, function (err, res) {
    console.log(`This is err  ${err} and res ${res}`);
});

Answer 1

这是因为您覆盖了 Promise 值。 then 或 catch 返回的值将传播到 Promise 链的其余部分。

如果您只是想“监视”Promise，则返回/抛出该值，或者不返回新的 > promise 。示例:

const promise = original.apply(this, args)

promise.then(data => {
    let end: any = new Date();
    end = end-start;
    console.log(`\nExecution of ${target.constructor.name}.${name} completed successfully in ${end / 1000} seconds`);
}).catch(error => {
    let end: any = new Date();
    end = end-start;
    console.log(`\nExecution of ${target.constructor.name}.${name} completed with error in ${end / 1000} seconds`);
});

return promise

或者

return original.apply(this, args).then(data => {
    let end: any = new Date();
    end = end-start;
    console.log(`\nExecution of ${target.constructor.name}.${name} completed successfully in ${end / 1000} seconds`);

    // propagate the return value
    return data;
}).catch(error => {
    let end: any = new Date();
    end = end-start;
    console.log(`\nExecution of ${target.constructor.name}.${name} completed with error in ${end / 1000} seconds`);

    // propagate the error value
    throw error
});