Question

我想在JavaScript中为事件监听器的回调注入一些值，但保留原始事件对象。这可能吗？

示例（＃1）：

function callback(event, arg) {
    console.log(event);
    console.log(arg);
}

var something = 2;

element.addEventListener(
    "click",
    callback.bind(element, ???, something)
);

如何在绑定其他参数时保留原始event对象？

我知道我可以做到这一点（＃2）：

element.addEventListener(
    "click",
    function (event) {
        callback(event, something);
    }
);

甚至这个（＃3）：

element.addEventListener(
    "click",
    function (event) {
        callback(event, this);
    }.bind(something)
);

但是＃2使得代码更加丑陋，因为我需要在异步调用中使用变量something，而在点击时它可能已被更改。

＃3抢断this，我可能需要这样做。

我错过了什么和/或我对绑定的理解是否正确？

Answer 1

您可以通过改变参数的顺序来“理解”您想要的参数：

function callback(arg, event) {
    console.log(event);
    console.log(arg);
}

var something = 2;
element.addEventListener("click", callback.bind(null, something));

这样您就可以传递“绑定”或部分应用为回调并仍然会收到Event个对象。有关详细信息，请参阅MDN "Partial Functions"文档的Function.prototype.bind部分。

Answer 2

只需制作适合您需要的自定义“绑定”功能即可。它有点像＃2，但带有丑陋的抽象。

[ScanApiConsumer invalidate];
ScanApiConsumer = nil;

然后像这样使用它。

function bindLast(fn) {
    var bound = Array.prototype.slice.apply(arguments, 1);

    return function() {
        Array.prototype.push.apply(arguments, bound);
        return fn.apply(this, arguments);
    };
}

请注意，您无需将 thisArg 传递给它。它只是在调用时使用element.addEventListener("click", bindLast(callback, something));的值。

Javascript：绑定参数，但保留原始参数？

2 个答案: