我可以將搜索框值作為參數傳遞給函數嗎？

Question

每個團隊都有一些對象，其中包含數字數組

一個示例團隊（真的設置了一個示例atm，只看得分的所有目標）

luton = {

    name: "Luton Town",
    link: "luton",
    league: "League 1",
    homeGoalsScored: [1, 2, 3, 1, 2, 3, 2, 4, 5, 4, 2, 2, 0, 4, 3],
    homeGoalsConceded: [1, 0, 2, 0, 2, 2, 0, 1, 1, 0, 0, 0, 0, 0, 2],

    awayGoalsScored: [0, 3, 1, 2, 0, 1, 3, 0, 0, 1, 2, 2, 2, 1, 1],
    awayGoalsConceded: [1, 3, 1, 2, 0, 1, 3, 0, 0, 1, 1, 0, 2, 1, 0],

    totalGoalsScored: [0, 1, 1, 2, 3, 1, 1, 1, 0, 2, 2, 3, 2, 2, 4, 2, 0, 
    5, 3, 4, 2, 2, 2, 2, 2, 0, 1, 4, 1, 3],
    totalGoalsConceded: [1, 1, 3, 0, 2, 1, 2, 0, 0, 2, 1, 2, 3, 0, 1, 0, 0, 
    1, 1, 0, 0, 1, 0, 0, 2, 0, 1, 0, 0, 2],

},

當我在控制台的系數函數中輸入兩個團隊的名稱作為參數時，它完全可以按照我的意願工作。

我希望用戶能夠在搜索框中鍵入兩個團隊，並在輸入時運行該函數，但是我似乎無法將兩個值傳遞給該函數。

我將需要更改搜索以實際從下面的對象中獲取鏈接，但是現在我只希望它起作用，所以我要按照對象的命名方式正確輸入團隊。

我的第一個項目，因此任何指導都將有所幫助

我嘗試使用showteams函數中所示的searchbox.value，並嘗試使用JSON.parse方法以及${awayTeam}但我不確定100％是否在做什么，請找到我的腳本（-球隊及其統計信息）

const awayGoalsBox = document.getElementById('away-gs');
const awayGoalsConcededBox = document.getElementById('away-gc');

const homeGoalsBox = document.getElementById('home-gs');
const homeGoalsConcededBox = document.getElementById('home-gc');

const arrAvg = (arr => arr.reduce((a, b) => a + b, 0) / arr.length); 

function applyGoals(stat, box) {
    var filled = (`${stat}`);
    box.innerHTML = filled;
};

function home(team) {
    var avgHomeGoalsLong = arrAvg(team.homeGoalsScored);
    var avgHomeGoals = avgHomeGoalsLong.toFixed(2);
    applyGoals(avgHomeGoals, homeGoalsBox);

    var avgHomeGoalsConcededLong = arrAvg(team.homeGoalsConceded);
    var avgHomeGoalsConceded = avgHomeGoalsConcededLong.toFixed(2);
    applyGoals(avgHomeGoalsConceded, homeGoalsConcededBox);
};

function away(team) {
    var avgAwayGoalsLong = arrAvg(team.awayGoalsScored);
    var avgAwayGoals = avgAwayGoalsLong.toFixed(2);
    applyGoals(avgAwayGoals, awayGoalsBox);

    var avgAwayGoalsConcededLong = arrAvg(team.awayGoalsConceded);
    var avgAwayGoalsConceded = avgAwayGoalsConcededLong.toFixed(2);
    applyGoals(avgAwayGoalsConceded, awayGoalsConcededBox);
};

function coefficient(homeTeam, awayTeam) {

    var avgHomeGoals = arrAvg(homeTeam.homeGoalsScored);
    var avgHomeGoalsConceded = arrAvg(homeTeam.homeGoalsConceded);

    var avgAwayGoals = arrAvg(awayTeam.awayGoalsScored);
    var avgAwayGoalsConceded = arrAvg(awayTeam.awayGoalsConceded);

    var i = (avgAwayGoals - avgHomeGoals);
    var j = (avgHomeGoalsConceded - avgAwayGoalsConceded);

    if (avgAwayGoalsConceded <= 0.5) {
        q = .5
    } else if (avgAwayGoalsConceded <= 1) {
        q = .4
    } else if (avgAwayGoalsConceded <= 1.5) {
        q = .3
    } else if (avgAwayGoalsConceded <= 2) {
        q = .2
    } else if (avgAwayGoalsConceded <= 2.5) {
        q = .1
    } else {
        q = 0
    };

    if (avgHomeGoalsConceded <= 0.5) {
        u = -.5
    } else if (avgHomeGoalsConceded <= 1) {
        u = -.4
    } else if (avgHomeGoalsConceded <= 1.5) {
        u = -.3
    } else if (avgHomeGoalsConceded <= 2) {
        u = -.2
    } else if (avgHomeGoalsConceded <= 2.5) {
        u = -.1
    } else {
        u = 0
    };

    if (avgAwayGoals <= 0.5) {
        y = 0
    } else if (avgAwayGoals <= 1) {
        y = .1
    } else if (avgAwayGoals <= 1.5) {
        y = .2
    } else if (avgAwayGoals <= 2) {
        y = .3
    } else if (avgAwayGoals <= 2.5) {
        y = .4
    } else {
        y = .5
    };    

    if (avgHomeGoals <= 0.5) {
        cc = 0
    } else if (avgHomeGoals <= 1) {
        cc = -.1
    } else if (avgHomeGoals <= 1.5) {
        cc = -.2
    } else if (avgHomeGoals <= 2) {
        cc = -.3
    } else if (avgHomeGoals <= 2.5) {
        cc = -.4
    } else {
        cc = -.5
    };

    var sum = (i + j + q + u + y + cc);

    away(awayTeam);
    home(homeTeam);

    var awaybox = document.querySelector(`#away`);
    var homebox = document.querySelector(`#home`);

    document.getElementById('name-away').innerHTML = awayTeam.name;
    document.getElementById('name-home').innerHTML = homeTeam.name;

    var sumNum = parseFloat(sum);
    var coeff = (sumNum / 5);   
    document.getElementById('coefficient').innerHTML = coeff.toFixed(2);
};

const homeSearch = document.querySelector('#home-search');
const awaySearch = document.querySelector('#away-search');
const submit = document.querySelector('#submit');

function showteams(e) {
    e.preventDefault();

    var homeTeam = homeSearch.value;
    var awayTeam = awaySearch.value;

    coefficient(homeTeam, awayTeam);
};

submit.addEventListener('click', showteams);

當我在控制台中輸入系數（homeTeam，awayTeam）時，它會進行統計並將其打印在相應的框中，但是當我使用搜索時，它會出現

script.js:5 Uncaught TypeError: Cannot read property 'reduce' of undefined
    at arrAvg (script.js:5)
    at coefficient (script.js:208)
    at HTMLInputElement.showteam (script.js:1524)

應要求，這是我的html

<body>
    <div class="grid">
        <header class="grid">
            <h1>betMarco</h1>
        </header>

    <div class="stats-box home" id="home">
        <h3 class="heading">HOME</h3>
        <form class="add-items">
            <input type="text" name="team" class="home-search" id="home- 
             search" placeholder="Home Team" value=" " required>
            <input type="submit" value="Submit" id="submit">
        </form>

        <div class="values name">
            <p id="name-home"></p>
        </div>
        <div class="values goals-scored">
            <h6>HGS PG:</h6>
            <p id="home-gs"></p>
        </div>
        <div class="values goals-conceded">
            <h6>HGC PG:</h6>
            <p id="home-gc"></p>
        </div>
    </div>


    <div class="stats-box away" id="away">
        <h3 class="heading">AWAY</h3>
        <form class="search-items">
                <input type="text" name="team" class="away-search"  
                 id="away-search" placeholder="Away Team" value=" ">
        </form>

        <div class="values name">
            <p id="name-away"></p>
        </div>
        <div class="values goals-scored">
            <h6>AGS PG:</h6>
            <p id="away-gs"></p>
        </div>
        <div class="values goals-conceded">
            <h6>AGC PG:</h6>
            <p id="away-gc"></p>
        </div>
      </div>
  </div>
  <script src="script.js" defer></script>
</body>

Answer 1

我知道了，它只是使用一個字符串而不是對象，相反，我發現如果將字符串與團隊數組中的一個對象匹配，則可以抓住該對象並提交所有數據所在的位置。 不確定這是否是最有效的方法，但是否有效

function showTeams(e) {
e.preventDefault();

let homeTeam = '';
let awayTeam = '';

if (premiership.find(o => o.name == homeSearch.value) || premiership.find(o => o.link == homeSearch.value)) {
    homeTeam = premiership.find(o => o.name == homeSearch.value) || premiership.find(o => o.link == homeSearch.value)
} else if (championship.find(o => o.name == homeSearch.value) || championship.find(o => o.link == homeSearch.value)) {
    homeTeam = championship.find(o => o.name == homeSearch.value) || championship.find(o => o.link == homeSearch.value)
} else if (leagueOne.find(o => o.name == homeSearch.value) || leagueOne.find(o => o.link == homeSearch.value)) {
    homeTeam = leagueOne.find(o => o.name == homeSearch.value) || leagueOne.find(o => o.link == homeSearch.value)
} else if (leagueTwo.find(o => o.name == homeSearch.value) || leagueTwo.find(o => o.link == homeSearch.value)) {
    homeTeam = leagueTwo.find(o => o.name == homeSearch.value) || leagueTwo.find(o => o.link == homeSearch.value)
};

if (premiership.find(o => o.name == awaySearch.value) || premiership.find(o => o.link == awaySearch.value)) {
    awayTeam = premiership.find(o => o.name == awaySearch.value) || premiership.find(o => o.link == awaySearch.value)
} else if (championship.find(o => o.name == awaySearch.value) || championship.find(o => o.link == awaySearch.value)) {
    awayTeam = championship.find(o => o.name == awaySearch.value) || championship.find(o => o.link == awaySearch.value)
} else if (leagueOne.find(o => o.name == awaySearch.value) || leagueOne.find(o => o.link == awaySearch.value)) {
    awayTeam = leagueOne.find(o => o.name == awaySearch.value) || leagueOne.find(o => o.link == awaySearch.value)
} else if (leagueTwo.find(o => o.name == awaySearch.value) || leagueTwo.find(o => o.link == awaySearch.value)) {
    awayTeam = leagueTwo.find(o => o.name == awaySearch.value) || leagueTwo.find(o => o.link == awaySearch.value)
};

coefficient(homeTeam, awayTeam)
};