javascript - 将事件对象传递给事件回调中的setter方法

Question

我正在使用 createjs 库。

我有以下类(class):

class Person {
 constructor(){
  this.name = 'John';
 }

 set updateName(event){
  this.name += event.key;
 }
}

接下来，我像这样实例化该对象:

var human = new Person();

我试图在每次击键时更新此人的姓名，如下所示:

window.addEventListener.on('keydown', human.updateName);

但是，我收到错误“无法读取未定义的属性‘handleEvent’”。

Answer 1

human.updateName 尝试读取 updateName 属性。由于您尚未为其定义 getter，因此结果为 undefined。显然，无论您将其传递给 (window.addEventListener.on)，都希望传递除 undefined 之外的其他内容。

要传递实际的 setter 函数有点棘手，您必须通过 getOwnPropertyDescriptor 访问它，然后将其传入:

window.addEventListener.on('keydown', Object.getOwnPropertyDescriptor(human, "updateName").set);

为了确保更新正确的人员，您可能还需要bind:

window.addEventListener.on('keydown', Object.getOwnPropertyDescriptor(human, "updateName").set.bind(human));

或者，使用箭头函数作为粘合剂会更简单:

window.addEventListener.on('keydown', e => {
    human.updateName = e;
});

<小时/>

附注:updateName 是您为方法提供的名称，而不是属性。通常，属性将被简单地称为name。

也许您打算将其作为一种方法？如果是这样:

class Person {
 constructor(){
  this.name = 'John';
 }

 updateName(event){ // No `set` on this line
  this.name += event.key;
 }
}

...和

window.addEventListener.on('keydown', human.updateName.bind(human));

或

window.addEventListener.on('keydown', e => {
    human.updateName(e);
});