Question

（这是this question的后续内容，但我在此处包括了所有必要的上下文。）

我正在尝试创建一个HTML接口元素系统，该系统将使用大量共享代码，并且在处理事件处理程序和范围时遇到了麻烦。该代码有效：

class Inator {
  constructor(whichCanvas, eventRegistry) {
    this.myCanvas = whichCanvas;
    this.foo = 10;
    for (var e in eventRegistry) {
      this.myCanvas.addEventListener(e,eventRegistry[e]);
    }
  }
  double(val) {
  	return val*2;
  }
}

class Ballgowninator extends Inator {
  constructor(whichCanvas) {
    super(
  	  whichCanvas, {
        mousedown: (e) => {
          alert("mousedown");
        },
        mouseup: (e) => {
          alert("mouseup");
        }
      }
    );
    this.bar = 20;
  }
  triple(val) {
  		return val*3;
  }
}

var c = new Ballgowninator(document.querySelector(".ballgown"));

.inator {
  background-color: white;
  border: solid 1px black;
  width: 90vw;
}

<canvas class="ballgown inator"></canvas>

（{Same code作为JSFiddle，如果您愿意的话）

但是，我希望能够从我传递给{{的事件处理程序中来访问double()，triple()，foo和bar 1}}。使用我现有的设置，这是否有可能，还是有一种更好的方法来重整整个方法？

谢谢！

从事件处理程序内部访问类/子类的函数和属性

0 个答案: