Question

我有以下设计代码：

class Animal {
  get age() {
    return this.baseage + 10;
  }

  age2() {
    return this.baseage + 10;
  }
}

const handler = {
  "get": function(target, key) {
     if (key === "baseage") {
       return 20;
     }

     return target[key];
  }
};

const animal = new Proxy(new Animal(), handler);

console.log(animal.age);
console.log(animal.age2());

哪个产生

NaN
30

在节点6.11.0上。

我希望类getter中的代码，特别是this.baseage，也可以通过代理的处理程序，但似乎并非如此。有什么理由吗？

Answer 1

return target[key]; 不与默认get处理程序的行为相同。这是get age函数损坏的原因。

const handler = {
  "get": function(target, key) {
     if (key === "baseage") {
       return 20;
     }

     return target[key];
  }
};

应该是

const handler = {
  "get": function(target, key, receiver) {
     if (key === "baseage") {
       return 20;
     }

     return Reflect.get(target, key, receiver);
  }
};

当您执行target[key]时，您正在呼叫get age(){，但是您使用target作为this来调用new Animal对象，而不是代理人。由于Proxy对象是处理baseage而不是Animal的对象，因此您将返回undefined。

在此示例中，receiver是实际的代理对象，因此您可能会receiver[key]使代码段正常工作，但吨有更多边缘案例可供您使用＃39; d仍然没有以一般方式处理。

每个Proxy处理函数都有Reflect.XX版本，可以公开默认行为。每当您编写代理并希望它按照通常的方式行事时，您应该使用Reflect。

在类getter中引用代理＆＃39; d

1 个答案: