javascript - .bind() 与事件处理程序

Question

假设我有以下简化函数。

var ex = document.getElementById('exampleElement'),
    data = {
        foo: 'Sample text'
    };

ex.addEventListener('click', function(evt, d) {
    evt.stopPropagation();
    this.innerHTML = d.foo;
}.bind(ex, null, data));

我意识到将 ex 绑定(bind)到 this 在这种特殊情况下有点多余，但是我如何绑定(bind) data 参数并仍然保留事件参数被销毁？

我似乎无法在任何地方找到答案。

Answer 1

根据 https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function/bind

arg1, arg2, ...

Arguments to prepend to arguments provided to the bound function when invoking the target function.

这意味着您的柯里化(Currying)值将出现在事件对象之前。看这个 fiddle 的例子:

http://jsfiddle.net/5w4vnvof/

var clickme = document.querySelector("#clickme");

clickme.addEventListener("click", function(value, event) {
    var newDiv = document.createElement("div");
    newDiv.innerHTML = value + "<br/>" + event.target.toString();

    document.body.appendChild(newDiv);
}.bind(clickme, "curriedValue"));