addEventListener绑定的函数中添加形式参数的问题

Question

比如说这段代码：

 function add() {
    console.log('add')
}
document.querySelector('#ipt').addEventListener('click',add);

我现在的需求是想让add函数中带参数，即：

 function add(val) {
    console.log('add'+val)
}
document.querySelector('#ipt').addEventListener('click',add('argument'));

这样写又不对，请问怎么实现add带参数的函数形式传入？

Answer 1

简单的话：document.querySelector('#ipt').addEventListener('click',function(){add('argument');});
fancy一点的话，可以用函数柯里化

Answer 2

因为监听函数的第二个参数必须为函数，所以要么外面套一层函数，要么add方法返回一个函数。

但其实这两点都不推荐，因为返回的函数没有变量对其引用，无法取消监听

最好将最终生成的函数赋给一个变量，用这个变量当参数

Answer 3

其实就是返回一个函数就好了

 function add(val) {
    return function(e) {
       console.log(val)
       console.log(e)
    }
}
document.querySelector('#ipt').addEventListener('click',add('argument'));