0

我知道 Javascript 中没有类，为了方便起见，我将构造函数称为类。

我正在制作一个InputHandler用 Javascript 调用的类。它有一个名为 的方法onMouseDown，并将其注册为一个事件处理程序，如下所示：

Irenic.InputHandler.prototype.attach = function()
{
    var inputHandler = this; //Get the instance of InputHandler

    document.addEventListener("keydown", inputHandler.onKeyDown, false); //Concentrate on this, but the question applies to all of these.
    document.addEventListener("keyup", inputHandler.onKeyUp, false);
    document.addEventListener("mousemove", inputHandler.onMouseMove, false);
    document.addEventListener("mouseup", inputHandler.onMouseUp, false);
    document.addEventListener("mousedown", inputHandler.onMouseDown, false);
}

（Irenic是我正在构建的引擎的名称，它也是一个包含所有这些类的全局对象。）

该inputHandler.onMouseDown方法如下所示：

Irenic.InputHandler.prototype.onMouseDown = function(event) { var inputHandler = this; //这可悲的是指的是文档，而不是 InputHandler 的实例

console.log(inputHandler); //Logs #document

if (event.button == 0)
{
    inputHandler.mouse.lmb = true;
}

if (event.button == 1)
{
    inputHandler.mouse.wheel = true;
}

if (event.button == 2)
{
    inputHandler.mouse.rmb = true;
}

}

正如我在评论中所说，this关键字是指事件触发的元素。我显然不希望这样：那么我如何让它引用一个实例InputLoader？

4

3 回答 3

6

用于Function.prototype.bind锁定函数的上下文：

inputHandler.onKeyDown.bind(inputHandler)

PS。使用switch, 或至少else if代替多个if构造。其中只有一个可能是真的。

于 2012-07-01T19:48:20.403 回答
5

在您的构造函数中，将实例的方法绑定到该实例：

function InputHandler() {
    this.onKeyDown = this.onKeyDown.bind(this);
    this.onKeyUp = this.onKeyUp.bind(this);
    this.onMouseMove = this.onMouseMove.bind(this);
    this.onMouseUp = this.onMouseUp.bind(this);
    this.onMouseDown = this.onMouseDown.bind(this);
}

这样，实例一经构建就准备就绪。

看Function#bind

于 2012-07-01T19:49:43.273 回答
1

我相信 bind 不适用于 IE <= 8，所以如果需要，这应该可以工作：

document.addEventListener("keydown", function (ev) { return inputHandler.onKeyDown(ev); }, false)
于 2012-07-01T19:55:43.243 回答