javascript - 重新定义事件处理程序的上下文

Question

我正在为 show_keyboard 事件创建一个监听器。在处理程序中，我需要解除此事件的绑定(bind)。在这种情况下，该事件是从 native Android 插件引发的。

appView.sendJavascript("cordova.fireWindowEvent('native.showkeyboard', { 'keyboardHeight':" + Integer.toString(keyboardHeight)+"});");

在 addHeightHandler 中，我需要 this 成为 addHeightHandler 的父级，以便与其解除绑定(bind)。因此，我在调用 addHeightHandler 时传递 self。但是，当我这样做时，我无法访问 e 和 keyboardHeight 属性。

注意:我的雇主坚持必须这样做，没有匿名函数或 self 变量的全局设置

/*
 * When keyboard is shown, add height of keyboard to body to make scrollable. 
 */
this.addHeightHandler = function (e) {
    keyboardHeight = e.keyboardHeight;
    //e is undefined 
    //do some stuff to add keyboard height
    window.removeEventListener('show_keyboard', this.addHeightHandler);
};

/*
 * Listen for showkeyboard events thrown by native code on Android
 */
this.addKeyboardListeners = function () {
    var self = this;
    window.addEventListener('native.showkeyboard', function () {
        self.addHeightHandler(self)
    }, false);
};

我知道还有其他方法可以做到这一点，但这是我被指示这样做的方式。我相信将 self 传递给 addHeightHandler 意味着 e 将被覆盖，这是正确的吗？

Answer 1

是的，如下:

this.addKeyboardListeners = function () {
    var self = this;
    window.addEventListener(eventConstants.nativeShowKeyboard, function () {
        self.addHeightHandler(self);
    });
};

正在传递 self 作为 e 的值。

您可以做的是将 addHeightHandler 函数绑定(bind)到所需的上下文。在 addKeyboardListeners 中，您可以:

this.addKeyboardListeners = function () {
    var handler = this.addHeightHandler.bind(this);
    addEventListener(eventConstants.nativeShowKeyboard, handler);
};

上面的作用是将addHeightHandler函数的上下文“绑定(bind)”到this，这意味着当调用它时，this函数内的关键字将是对绑定(bind)时 this 的引用。

该函数仍将 e 作为参数，因此当事件发生且处理程序运行时，e 仍将是事件。