javascript - 使用事件监听器时保持“this”的值

Question

我有以下功能：

onDocumentKeyUp: function (e) {
    if (e.keyCode === 27) {
       this.deactivate();
    }
}

我想像这样绑定它：

$(document).on('keyup', onDocumentKeyUp);

但是，当我这样做时，函数this内部是onDocumentKeyUp指文档。我通过这样做解决了这个问题：

var self = this;
$(document).on('keyup', function(e) { self.onDocumentKeyUp(e); });

这行得通，但有件事告诉我有一种更清洁的方法可以解决这个问题。会.call()或.apply()以某种方式......在这里申请？我仍然不确定这些功能是如何工作的。

另外，我不一定需要将自己限制在jQuery.on(). 如果有这样做的“香草”方式，请成为我的客人来教我。

score 2 · Accepted Answer

您可以使用.bind()来设置上下文（无需立即将其称为callor apply）：

$(document).on('keyup', this.onDocumentKeyUp.bind(this));

由于此方法仅受 ES5.1 兼容的浏览器支持，因此您可以使用jQuery.proxy它而不是 polyfill。

score 1 · Accepted Answer

请注意这里方法的data参数： http ://api.jquery.com/on/ 您也可以使用 jQuery.proxy 方法：http ://api.jquery.com/jQuery.proxy/on

这是 jsFiddle：jsFiddle

2 回答 2