我可以在多个事件侦听器中重用javascript函数吗？

Question

我想在多个事件监听器中重用一个长函数。

有没有办法可以在多个事件监听器中重用javascript函数（没有jQuery或其他库）。

我尝试了一些事情。

function one(){
    console.log("not supposed to show until I press the variable containing num1")
};


num1.addEventListener('click', one());

在开头运行该功能，而不是在点击时运行

num1.addEventListener('click', function one(){
    console.log("oops")
});
num2.addEventListener('click', one());

当我按下num1时，当我按下num1时运行不起作用

const one = () => {console.log("Still not working")}
num1.addEventListener('click', one());

与第一个例子相同的问题。

我想在多个事件监听器中重用一个长函数。

Answer 1

你应该使用像这个num1.addEventListener("click", one); num2.addEventListener("click", one);与之前声明的function one(...){...}

Answer 2

你应该提供一个由事件监听器调用的函数，但是通过做one()你不提供函数而是提供由该函数返回的函数。

像@Luis Barajas提到的那样，做num1.addEventListener("click", one)

Answer 3

one()返回undefined你传递undefined而不是回调。你可以传递一个函数并在其中调用one()。

let num1 = document.querySelector('#num1');
let num2 = document.querySelector('#num2');


function one(){
  console.log("Its working ");
}
num1.addEventListener('click', (e) => {
  one()
});
num2.addEventListener('click', (e) => {
  one()
});

<button id="num1">Num 1</button>
<button id="num2">Num 2</button>