Javascript 为什么当我在事件侦听器中时，我的变量会初始化？

那么你好,

这是我的问题。我有这个Javascript，我的变量“position”在输入

under[i].addEventListener("click", function(){

            alert(position.y + "  " + position.x);

            score[i].setAttribute("style","-webkit-transform: translateY(-" + position.y + "px); -webkit-transition: .5s ease-in-out .01s;");

            under[i].classList.add("popout");
            score[i].classList.add("popScore");

            under[i].classList.remove("underlayer_score");
            score[i].classList.remove("scores_teams");

        });

这很奇怪，因为当我在eventlistener之前或之后检查时，值仍然分配在该变量中。我仍然是Javascript的初学者，所以，如果我的解释不太清楚，很抱歉

谢谢你的帮助

下面是Javascript：

var-under=新数组（10）；
分数=新数组（10）；
var位置=0；
对于（var i=0；i也许您应该尝试检查窗口内的内容。位置？可能是该位置不是全局的吗？
您需要将事件侦听器处理程序包装在一个closure中。您希望发生什么？您在
警报后将
位置.y
设置为
0
，这就是
位置.y
为
0
的原因>在事件处理程序中。
position
对于所有处理程序都是相同的对象。对于
i
也一样，对于所有处理程序都是
3
。
<script>

    var under = new Array(10);
        score = new Array(10);

    var position = 0;

    for(var i = 0; i <= 2; i++){

        under[i] = document.getElementsByClassName('underlayer_score')[i];
        score[i] = document.getElementsByClassName('scores_teams')[i];

    }

    function getPosition(element) {
        var xPosition = 0;
        var yPosition = 0;

        while(element) {
            xPosition += (element.offsetLeft - element.scrollLeft + element.clientLeft);
            yPosition += (element.offsetTop - element.scrollTop + element.clientTop);
            element = element.offsetParent;
        }
        return { x: xPosition, y: yPosition };
    }


    for(var i = 0; i <= 2; i++){

        position = getPosition(score[i]);

        under[i].addEventListener("click", function(){

            alert(position.y + "  " + position.x);

            score[i].setAttribute("style","-webkit-transform: translateY(-" + position.y + "px); -webkit-transition: .5s ease-in-out .01s;");

            under[i].classList.add("popout");
            score[i].classList.add("popScore");

            under[i].classList.remove("underlayer_score");
            score[i].classList.remove("scores_teams");

        });

        alert(position.y);

        position.x = 0;
        position.y = 0;

    }

</script>