Javascript 通过DOM重新定义全局变量（forEach addEventListener）

我正试图创建一个石头剪刀游戏，但我似乎被其中一个变量的全局/局部声明卡住了。我在使用函数的人身上发现了类似的问题，但我似乎无法将解决方案转换为使用DOM方法

let playerChoice;

const playerBtns = document.querySelectorAll("button");
playerBtns.forEach((button) => {
    button.addEventListener("click", (e) => {
        let playerChoice = button.id;
    });
});

我遇到的问题是playerChoice是在本地声明的，而我的另一个函数试图全局地获取这个变量

我有没有办法在全球范围内重新定义playerChoice

对于下面的函数roundWinner（），playerChoice未定义

function compSelection() {
    choices = ["rock", "paper", "scissors"];

    let compChoice = Math.floor(Math.random() * choices.length);
    return choices[compChoice];
} 

function roundWinner() {
    const outcome = {
        rock: {lose: "paper", win: "scissors"},
        paper: {lose: "scissors", win: "rock"},
        scissors: {lose: "rock", win: "paper"}
    }

    if (outcome[playerChoice].win === compChoice()) {
        alert("You win!");
    } else if (outcome[playerChoice].lose === compChoice()) {
        alert("Computer wins!");
    } else {
        alert("Tie!");
    }
}  

---

谢谢

最简单的方法是重命名任一变量。然而，维护一个全局变量总是一个坏主意。它添加了一个sideeffects只需使用

roundWinner

作为事件处理程序，而不是只更改全局变量的内容。

==compChoice（）

应该是

==compSelection（）

，如果（…），则只需调用一次，而不是每次调用它。