總和未顯示在功能中

Question

我試圖從數組中返回一個總和，由於某種原因，它沒有顯示。 我嘗試了各種方法，但是由於某種原因，它沒有返回數組的總和。 當我從控制台調用tableSum(sum) ，它將返回它，但是在JavaScript中卻沒有發生。

這是我的代碼：

var tableSum = function () {
    'use strict';
    var sum = 0,
        i;
    for (i = 0; i < numberArray.length; i += 1) {
        sum += numberArray[i];
    }
    return sum;
    document.getElementById('sum').innerHTML = sum;
};

HTML：

<table border="1">
    <tr>
        <td style = "text-align:right;">Sum:</td>
        <td style="width:100px" id = "sum">&#160;</td>
    </tr>

Answer 1

return語句退出該函數，並阻止執行嘗試將結果分配給DOM元素的該行下面的行。 從Mozilla的文檔中 ：

函數立即在調用return的位置停止。

請嘗試以下操作：

var tableSum = function () {
    'use strict';
    var sum = 0, i;
    for (i = 0; i < numberArray.length; i += 1) {
        sum += numberArray[i];  
    }

    return sum;
};

document.getElementById('sum').innerHTML = tableSum();

將呈現與您的函數分開可以使它更加靈活和可重用，例如，您可以使用同一函數來更新其他DOM元素。

Answer 2

看起來您要從函數中返回，然后再更新DOM。

嘗試在DOM操作之后將return語句移至：

document.getElementById('sum').innerHTML = sum;
return sum;