How do I move the function outside the loop

Question

I've an warning that "Don't make functions within a loop", I know there are already some post regarding this Don't make functions within a loop

But I'm newbie and has no idea how to do this, can anyone help?

for (const el of testing) {
  el.addEventListener("click", function() {
    const apple = this.dataset.open;
    document.getElementById(apple).classList.add(orange);
  });
}

jeremy-denis · Accepted Answer · 2022-01-04T14:45:10.233

in fact when you do

for (const el of testing) {
  el.addEventListener("click", function() {
    const apple = this.dataset.open;
    document.getElementById(apple).classList.add(orange);
  });
}

you create a new instance of a new function each time the loop is iterate

a better way is to have a function declared outside the loop

function myfunction() {
    const apple = this.dataset.open;
    document.getElementById(apple).classList.add(orange);
  });

for (const el of testing) {
  el.addEventListener("click", myfunction);
}

How do I move the function outside the loop

1 Answers1