Петля и функции

Question

У меня возникли проблемы с сбором информации о щелкнувших eventListeners.

У меня этот цикл, который строит массив:

myButtonList = document.getElementsByTagName('a'); 
myAnchorList = []; 

for (i=0; i < myButtonList.length;i++) { 
    if (myButtonList[i].getAttribute('class') == 'flagged') { 
     myAnchorList.push(myButtonList[i]); 
    } 
} 

Для каждого <a> введен в myAnchorList массив, я также создать другой массив, хранящий другую информацию из того же тега (Класса и других atrributes).

Вот где я боюсь. Я пытаюсь настроить eventListener, чтобы отправить мне эту информацию при нажатии этих <a>. Но почему-то тот факт, что я создаю функцию (для eventListener) внутри цикла, разбивает все.

for (i=0; i < myAnchorList.length; i++) { 
    myAnchorList[i].addEventListener("click", function(i){ 
     console.log(alpha+' - '+beta[i]+" - "+charlie[i]); 
    }); 
} 

Мои ценности будут либо undefined или какие-то другие ценности, которые будут одинаковыми для каждой кнопки я щелкнул. alpha работает хорошо, поскольку он не зависит от какой-либо итерации цикла, но не от других.

Может ли кто-нибудь увидеть, что я делаю неправильно здесь?

Answer 1

for (var i = 0; i < myAnchorList.length; i++) { 
    (function (i) { //Passes i to your function 
     myAnchorList[i].addEventListener("click", function() { 
      console.log(alpha+' - '+beta[i]+" - "+charlie[i]); 
     }); 
    })(i); 
} 

Answer 2

Переменная «i» в замыкании, которую вы создали в цикле, всегда будет извлекать последнее значение (myAnchorList.length - 1). Вы не должны создавать замыкание в цикле, и вы можете использовать «фабричный» метод для создания закрытия.