为双组竞技JavaScript代码添加26-0提前获胜条件的技术求助

嘿，我来帮你搞定这个双组竞技的规则修改～ 你的需求是在原「先到54分获胜」的基础上，新增「任意一队26-0直接获胜」的特殊规则对吧？我看你用if/else没搞定，大概率是条件判断的时机或者顺序出了问题，下面给你完整的可运行方案：

完整修改后的代码 #

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script>
// 第一组分数管理闭包，封装分数状态
const firstFunct = (() => {
  let counter = 0;
  return {
    increment: () => {
      counter++;
      checkWinCondition(); // 加分后立即检查获胜条件
      updateDisplay();
    },
    getScore: () => counter, // 暴露获取分数的方法
    reset: () => {
      counter = 0;
      updateDisplay();
    }
  };
})();

// 第二组分数管理闭包，逻辑和第一组一致
const secondFunct = (() => {
  let counter = 0;
  return {
    increment: () => {
      counter++;
      checkWinCondition();
      updateDisplay();
    },
    getScore: () => counter,
    reset: () => {
      counter = 0;
      updateDisplay();
    }
  };
})();

// 更新页面上的分数显示（需要页面有对应元素）
function updateDisplay() {
  $('#first-score').text(firstFunct.getScore());
  $('#second-score').text(secondFunct.getScore());
}

// 核心：统一检查所有获胜条件的函数
function checkWinCondition() {
  const firstScore = firstFunct.getScore();
  const secondScore = secondFunct.getScore();

  // 优先检查「26-0提前获胜」的特殊规则
  if (firstScore === 26 && secondScore === 0) {
    announceWinner('第一组');
    resetGame();
    return; // 触发获胜后直接跳出，不再检查其他条件
  }
  if (secondScore === 26 && firstScore === 0) {
    announceWinner('第二组');
    resetGame();
    return;
  }

  // 再检查原有的「先到54分获胜」规则
  if (firstScore >= 54) {
    announceWinner('第一组');
    resetGame();
    return;
  }
  if (secondScore >= 54) {
    announceWinner('第二组');
    resetGame();
    return;
  }
}

// 宣布获胜者的逻辑（可以改成页面弹窗/文本提示，这里用alert示例）
function announceWinner(team) {
  alert(`${team}获胜！`);
  // 如果你想在页面显示获胜信息，也可以换成：
  // $('#winner-msg').text(`${team}获胜！`).show();
}

// 获胜后重置游戏状态
function resetGame() {
  firstFunct.reset();
  secondFunct.reset();
  // 如果有页面获胜提示元素，重置隐藏：
  // $('#winner-msg').hide();
}

// 页面加载完成后初始化分数显示
$(document).ready(() => {
  updateDisplay();
});
</script>

<!-- 配套的示例HTML结构，你可以根据自己的页面调整 -->
<div class="game-container">
  <div class="team-score">
    <h3>第一组分数：<span id="first-score"></span></h3>
    <button onclick="firstFunct.increment()">第一组加分</button>
  </div>
  <div class="team-score">
    <h3>第二组分数：<span id="second-score"></span></h3>
    <button onclick="secondFunct.increment()">第二组加分</button>
  </div>
  <div id="winner-msg" style="display:none; margin-top:20px; font-size:24px; color:#2ecc71;"></div>
</div>

关键修改点说明 #

• 把获胜检查抽成独立函数：每次加分后都调用checkWinCondition()，避免重复写判断逻辑，也方便后续修改规则。
• 优先判断特殊规则：因为「26-0直接获胜」是提前终止游戏的规则，必须放在54分规则前面判断，确保特殊规则优先触发。
• 闭包的分数访问：通过闭包暴露getScore()方法，既保证了分数变量的封装性（不会被外部随意修改），又能让检查函数获取到实时分数。
• 获胜后立即终止流程：每次触发获胜条件后，用return跳出函数，避免继续执行后续的判断逻辑，同时调用resetGame()重置状态。

内容的提问来源于stack exchange，提问作者Mohammed Salim