在JavaScript代码中应用Decorator设计模式存在问题

Question

我有一个名为Calculation的类，我添加了两个函数addOperationToName()和sayOperation()作为Decorator设计模式的示例。然而，当我使用Jest测试它时，我得到了一个错误，"fn不是一个函数"。有人能帮帮我吗?

Calculation.js

class Calculation {
constructor(a, b, op) {
this.a = a;
this.b = b;
this.op = op;
}
static Create(a, b, op){
return new Calculation(a, b, op);
}
GetResults() {
return this.op(this.a,this.b)
}
addOperationToName(fn){
return function(name){
const operation = name + ' is a operation';
fn(operation);
}
}
sayOperation(name){
console.log(name);
}
}
module.exports = Calculation;

Calculation.test.js

const Calculation = require('../src/models/Calculation');
test('Test say name for Product operation', () => {
let op = Product;
let calculation = new Calculation(1,2,op);
let sayTest = calculation.addOperationToName(calculation.sayOperation());
expect(sayTest('Multiply')).toBe('Multiply is an operation');
});

Answer 1

您应该将函数传递给addOperationToName，现在您正在返回函数的结果-只需将calculation.addOperationToName(calculation.sayOperation());更改为calculation.addOperationToName(calculation.sayOperation);

class Calculation {
constructor(a, b, op) {
this.a = a;
this.b = b;
this.op = op;
}
static Create(a, b, op){
return new Calculation(a, b, op);
}
GetResults() {
return this.op(this.a,this.b)
}
addOperationToName(fn){
return function(name){
const operation = name + ' is a operation';
return fn(operation);
}
}
sayOperation(name){
console.log(name);
return name;
}
}
let calculation = new Calculation(1,2,null);
let sayTest = calculation.addOperationToName(calculation.sayOperation);
console.log(sayTest('Multiply') === 'Multiply is a operation')