Могу ли я повторно использовать функции JavaScript в нескольких прослушивателях событий?

Question

Я хочу повторно использовать одну длинную функцию в нескольких прослушивателях событий.

Можно ли повторно использовать функции javascript в нескольких прослушивателях событий (без jQuery или других библиотек).

I 'мы попробовали несколько вещей.

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, не работает, когда я пишу num2

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

та же проблема, что и в первом примере.

Я хочу повторно использовать одну длинную функцию в нескольких прослушивателях событий.

Answer 1

вы должны предоставить функцию, которая будет вызываться прослушивателем событий, но, делая one(), вы не предоставляете функцию вместо предоставления того, что возвращается этой функцией.

подобно @ Луис Барахас упомянуто, до num1.addEventListener("click", one)

Answer 2

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>

Answer 3

Вы должны использовать вот так num1.addEventListener("click", one); num2.addEventListener("click", one); С function one(...){...} ранее объявленным