如何将JavaScript计分板的主队与客队得分函数合并？

当然可以合并！你的代码里重复了大量逻辑一致的函数，核心差异只是操作的队伍和加分值，我们可以通过抽象通用逻辑来大幅简化代码。

方案一：通用加分函数（适合初学者理解） #

把主队和客队的加分逻辑合并成一个函数，通过参数区分队伍和加分值：

/*Scoring*/
let homeScore = 0;
let guestScore = 0;

const homeScoreCard = document.getElementById("home-score");
const guestScoreCard = document.getElementById("guest-score");

// 通用加分函数，接收队伍标识和加分点数
function updateScore(team, points) {
    if (team === 'home') {
        homeScore += points;
        homeScoreCard.innerHTML = homeScore;
    } else if (team === 'guest') {
        guestScore += points;
        guestScoreCard.innerHTML = guestScore;
    }
}

// 给按钮绑定事件时直接传参（示例）
// 假设主队3分按钮id是home-3，以此类推
document.getElementById('home-3').addEventListener('click', () => updateScore('home', 3));
document.getElementById('home-2').addEventListener('click', () => updateScore('home', 2));
document.getElementById('home-1').addEventListener('click', () => updateScore('home', 1));

document.getElementById('guest-3').addEventListener('click', () => updateScore('guest', 3));
document.getElementById('guest-2').addEventListener('click', () => updateScore('guest', 2));
document.getElementById('guest-1').addEventListener('click', () => updateScore('guest', 1));

方案二：用对象封装队伍数据（更模块化） #

把每个队伍的分数和DOM元素封装成对象，让代码结构更清晰，后续扩展更方便：

/*Scoring*/
// 封装两队的分数和计分板元素
const teams = {
    home: {
        score: 0,
        card: document.getElementById("home-score")
    },
    guest: {
        score: 0,
        card: document.getElementById("guest-score")
    }
};

// 通用加分函数
function updateScore(team, points) {
    teams[team].score += points;
    teams[team].card.innerHTML = teams[team].score;
}

// 按钮绑定事件示例
// document.getElementById('home-3').addEventListener('click', () => updateScore('home', 3));
// 其余按钮同理

这样原来的8个加分函数就被简化成1个通用函数，代码冗余问题彻底解决，后续如果要添加新的加分规则（比如加5分），只需要给按钮绑定事件时传入对应的点数即可，不需要再写新函数。

内容的提问来源于stack exchange，提问作者Sharon Kaufman