Javascript除法返回錯誤的數字

Question

我正在嘗試為課程創建一個簡單的網頁，用戶可以在其中計算棒球指標統計信息。 我目前有以下HTML：

<div>
    <h2>BABIP calculator</h2>

    <p class="extra">If number of sacrifice flies is not known it can be left blank and the BABIP calculation should still be fairly accurate as sacrifice flies typically account for a very small amount of At-Bats</p>
    <form id="BABIPform">
        <div>
            <label for="hits">Hits</label>
            <input type="text" name="hits" id="hits" value="0" min="0" required>
        </div>
        <div>
            <label for="homeruns">Homeruns</label>
            <input type="text" name="homerunsBABIP" id="homerunsBABIP" value="0" min="0" required>
        </div>
        <div>
            <label for="atBats">At-Bats</label>
            <input type="text" name="atBats" id="atBatsBABIP" value="0" min="0" required>
        </div>
        <div>
            <label for="k">Strikeouts</label>
            <input type="text" name="k" id="k" value="0" min="0" required>
        </div>
        <div>
            <label for="sf">Sacrifice Flies</label>
            <input type="text" name="sf" id="sf" value="0" min="0">
        </div>
        <div>
            <label for="babip">BABIP</label>
            <input type="text" name="babip" id="babip" disabled>
        </div>
        <div>
            <input type="submit" value="Calculate" id="submitBABIP">
        </div>
    </form>
</div>
<div>
        <h2>ISO calculator</h2>

    <p class="extra">ISO is a metric used to determine a player's raw power ouput more accurately than the standard SLG % by disregarding singles</p>
    <form id="ISOform">
        <div>
            <label for="doubles">2B</label>
            <input type="text" name="doubles" id="doubles" value="0" min="0" required>
        </div>
        <div>
            <label for="triples">3B</label>
            <input type="text" name="triples" id="triples" value="0" min="0" required>
        </div>
        <div>
            <label for="homeruns">HR</label>
            <input type="text" name="homeruns" id="homerunsISO" value="0" min="0" required>
        </div>
        <div>
            <label for="atBats">At-Bats</label>
            <input type="text" name="atBats" id="atBatsISO" value="0" min="0" required>
        </div>
        <div>
            <label for="iso">ISO</label>
            <input type="text" name="iso" id="iso" disabled>
        </div>
        <div>
            <input type="submit" value="Calculate" id="submitISO">
        </div>
    </form>
</div>

和以下JS一起使用。

function calculateBABIP() {
    'use strict';
    var BABIP;
    var AB = document.getElementById('atBatsBABIP').value;
    var H = document.getElementById('hits').value;
    var HR = document.getElementById('homerunsBABIP').value;
    var K = document.getElementById('k').value;
    var SF = document.getElementById('sf').value;
    BABIP = ((H-HR)/(AB-K-HR+SF)) 
    BABIP = BABIP.toFixed(3);
    document.getElementById('babip').value = BABIP;
    return false;
}

function initBABIP() {
    'use strict';
    var BABIPform = document.getElementById('BABIPform');
    BABIPform.onsubmit = calculateBABIP;
}


function calculateISO() {
    'use strict';
    var ISO;
    var doubles = document.getElementById('doubles').value;
    var triples= document.getElementById('triples').value;
    var HR = document.getElementById('homerunsISO').value;
    var AB = document.getElementById('atBatsISO').value;
    ISO = ((doubles)+(2*triples)+(3*HR))/AB;
    ISO = ISO.toFixed(3);
    document.getElementById('iso').value = ISO;
    return false;
}

function initISO() {
    'use strict';
    var ISOform = document.getElementById('ISOform');
    ISOform.onsubmit = calculateISO;
}

兩種形式的問題不同。 對於我的第一個表格（BABIPform），我測試了一個簡單的示例，該示例在60個擊球中擊中30個命中點，應等於.500，但是它將答案前加0，因此其格式為0.050。
對於ISO格式，我在600次擊球中輸入了30次雙打，5次三聯和20次本壘打，該函數返回501.767而不是.166。 我在這里的問題中進行了徹底的搜索，沒有找到任何能描述問題的東西，並且試圖操縱我的方程式但找不到原因。 任何幫助，或者如果有人知道某個工具，它將向我展示正在執行的la python家教類型程序，將不勝感激。

Answer 1

您遇到了一個常見的JavaScript 陷阱 ，即+用作加法運算符和字符串串聯運算符。 當您從表單中拉出值時，它們是字符串，並且是以下表達式：

AB - K - HR + SF

...為您輸入的值返回"600" 。 這實際上是字符串"60"和"0" 。 換句話說，減法是按您期望的那樣執行的，但是沒有加法（它是字符串連接）。

要解決此問題，您應該首先將所有數字字符串轉換為數字（例如使用parseInt ）；

您的第二個問題可能看起來有所不同，但這是由同一件事引起的。 您只需要在對字符串執行算術之前就將其轉換。