理解自调用函数（在循环中使用）

Question

最近我使用js将事件监听器添加到他们拥有相同类的所有元素。例如＆＃34;些＆＃34;我想通过一个函数来获得具有不同事件监听器的元素。 我做了这样的事情：

＆＃13;

＆＃13;

var ones = document.getElementsByClassName("one");
for (var i = 0; i < ones.length; i++) {
                ones[i].addEventListener('click',function(event){
					ale(i)});
                }
function ale(i){
	alert(i);
	}

＆＃13;

＆＃13;

＆＃13; 我希望当我点击第一个元素时它会显示1，第二个和...但是当我点击每个元素时（使用class =＆＃34;其中＆＃34;）显示7（数组的长度为1） 但是当我在寻找解决这个问题时，我得到了这个答案：

＆＃13;

＆＃13;

var ones = document.getElementsByClassName("one");
for (var i = 0; i < ones.length; i++) {
	(function(i){
                ones[i].addEventListener('click',function(event){
					ale(i)});
	})(i)
                }
function ale(i){
	alert(i);
	}

＆＃13;

＆＃13;

＆＃13;

但我不明白为什么？ 有人能帮我吗 ？ 我enter code here听说这是一个自我调用函数。它的意思是什么？