javascirpt 闭包

前段时间看到一道面试题

<p>P1</p>
<p>P2</p>
<p>P3</p>
<p>P4</p>
<p>P5</p>
<p>P6</p>

<script>
function clickP(){
var a = document.getElementsByTagName("p");
    for(var i=0;i<a.length;i++){
            a[i].onclick = function(){
                    alert(i);
                };
        }

}

clickP();
</script>

点击所有P标签弹出提示都是6，如果改进clickP()使点击P提示对应的索引1、2、3....

因为click事件还没触发，循环已经完成，所以无论点哪个P都提示6

/*修改上述方法，点击p弹出对应序号
        *创建闭包的一条原则就是：不要引用循环变量！
        *如果一定要在闭包中引用循环变量怎么办？？？

        *方法是再创建一个函数，将循环变量作为函数参数传入
        */
        
        
        function clickP(){
                var a = document.getElementsByTagName("p");
                for(var i=0;i<a.length;i++){
                            var fn = function(n){
                                a[n].onclick = function(){
                                    alert(n+1);
                                }
                                }
                            fn(i);
                    }
            }
        
        clickP();