Javascript 单击侦听器两次

我正在创建Simon游戏作为Freecodecamp挑战，我完成了基本的事情，现在我正在努力重新设置游戏。我有一个功能，重置它，清除阵列，超时等

问题是，当我再次单击开始按钮开始新游戏时，它会重置，开始新游戏，但单击颜色会触发在玩家阵列中按两次颜色

下面是一些代码：

函数重置（）{
清除超时（重复）；
clearTimeout（genColor）；
PickedColor=[]；//计算机随机颜色
猜颜色=[]；//玩家选择的颜色应该与选择的颜色匹配
gameOn=false；
countNumber=0；
}
函数游戏（）{
//计数
console.log（pickedColors、gussingcolors）；
counter.innerHTML=countNumber；
//新颜色
genRandom=setTimeout（（）=>{
getRandomColor（）；
}, 5);
猜颜色=[]；
//为每种颜色添加单击侦听器
对于（设i=0；i理想情况下，在使用完事件侦听器后将其删除，或者将其置于
游戏（）之外，但这里有一个快速解决方案：

使用
.onclick
而不是
addEventListener
，这将在调用
game（）
时覆盖原始事件，而不是添加另一个事件，您可以在别处使用
if（colors.children[i].onclick）
检查元素是否附加了事件
onclick

笔中的第157行变为：
colors.children[i].onclick=function（e）{

并删除第204行的
）


document.querySelector（'#btn'）.onclick=function（）{
console.log（'here'）；
};
document.querySelector（'#btn'）.onclick=function（）{
console.log（'hello'）；//这将覆盖第一个
}; 
if（document.querySelector（'#btn'）.onclick）
log（'它有一个事件侦听器'）；
其他的
console.log（'it nots'）；
单击我
您必须在
游戏
功能之外附加侦听器，或者在
重置
功能中分离侦听器。请检查此项
        function reset() {
        clearTimeout(repeating);
        clearTimeout(genColor);
        pickedColors = []; // computer random colors
        guessingColors = []; //colors that player picks, should match picked ones
        gameOn = false;
        countNumber = 0;  
    }

     function game() {
// Counting
  console.log(pickedColors, guessingColors);
      counter.innerHTML = countNumber;
// New color
          genRandom = setTimeout(() => {
             getRandomColor();
              }, 5);
        guessingColors = [];
 // Add click listener for each color
  for(let i=0; i<colors.children.length; i++) {
    // Guessing

    colors.children[i].addEventListener("click", function(e) {
      if(!running) {
        // Add clicked color to user clicked array
          guessingColors.push(this);
        console.log(guessingColors);
      // Add animation class
        clickClass(this);
      } else {
        e.stopPropagation();
      }

    // repeating.....