如何给Javascript回调提供参数

Question

我是Java语言的初学者，我有一个关于如何为回调提供参数的问题。目前，我有两个代码块，它们基本上与下面的代码相同。

let backArrow = document.createElement("INPUT")
backArrow.type = "image"
backArrow.src = "./images/noun_back_878298.png"
backArrow.alt = "Back"
backArrow.onclick = removeModuleMobile
backArrow.id = "back-arrow"
document.body.appendChild(backArrow)

它们之间的唯一区别是，它们将backArrow.onclick设置为removeModule而不是removeModuleMobile。相反，我想做一些事情，为回调提供参数，但将它们发送到同一回调，从而消除重复的代码，并使工作流程更具逻辑性。例如：

backArrow.onclick = removeModule(notMobile)

或

backArrow.onclick = removeModule(mobile)

我不认为这是允许的，尽管这是一个函数调用？我已经看到了很多东西，但是我应该在这里使用bind（）还是有其他关闭技术。谢谢您的帮助。

Answer 1

您可以使用bind：

backArrow.onclick = removeModule.bind(backArrow, mobile)

arrow functions：

backArrow.onclick = () => removeModule(mobile);

或只是常规功能：

backArrow.onclick = function() {
  removeModule(mobile);
}

几乎没有区别，一旦调用，大多数值this就会在removeModule内部。第一个是bind，是最接近分配backArrow.onclick = removeModule的那个，因为我们强制（请参见bind的第一个参数）将上下文对象this设置为backArrow。

[对于箭头函数，在声明箭头函数时，this将获得this的值，对于常规函数（除非由apply或call强制），它将是全局对象（ window（如果您使用的是浏览器）。

P.S。您可能要使用addEventListener而不是设置onclick：它可以使您更好地控制事件，并且更加灵活。

Answer 2

您可以分配button.onclick如下。

Answer 3

如果多次使用相同的代码段，请使用要更改的参数创建该函数的功能，然后使用“ removeModuleMobile”调用该函数，然后使用“ removeModule”调用该函数。

Answer 4

答案