Javascript 在表中添加和求平均值时如何处理 NaN

Question

我正在尝试编写一个高效的 JavaScript 函数，该函数将循环遍历表格，获取所有数字，并忽略所有带有字符串的 td。将添加列并求平均值，并为每列添加行。

我有这项工作的基本功能。然而，如果表不包含字符串，则结果符合预期。当表确实包含字符串时，该列的总计和平均值相差很大，我不确定答案是如何计算的。我希望有人可以帮助我找到一种方法来忽略这些值，并创建一种更有效的方法来编写此函数。

最后，我希望能够通过简单地传入表来调用这个函数，例如buildRows(表);

这是我到目前为止得到的:

// function to build total and average rows
function buildRow($element) {
    var result = [];
    $($element).find('tbody tr').each(function() {
      // Ignore the first column reserved for labels
      $('td:not(:first)', this).each(function(index, val) {
        if (!result[index]) result[index] = 0;
        result[index] += parseInt($(val).text());
      });
    });
    // Get the total amount rows
    var rowCount = $($element).find('tbody tr').length;
    // Add Average Row
    $($element).append('<tr class="avg-row"></tr>');
    $($element).find('tr').last().append('<td>' + 'Averages' + '</td>');
    $(result).each(function() {
        $($element).find('tr').last().append('<td class="avg-td">' + this / rowCount + '</td>');
    });
    // Add Total Row
    $($element).append('<tr class="total-row"></tr>');
    $($element).find('tr').last().append('<td>' + 'Totals' + '</td>');
    $(result).each(function() {
        $($element).find('tr').last().append('<td class="total-td">' + this + '</td>');
    });        
}

// ideal function calls
var tableOne = $('.tableOne');
buildRow(tableOne);
var tableTwo = $('.tableTwo');
buildRow(tableTwo);

table {
  border: 1px solid #333;
  padding: 10px;
  margin-right: 5px;
}
table tr:nth-child(odd) {
  background-color: #e0e0e0;
}
table td {
  padding: 10px;
  border: 1px solid #555;
  text-align: center;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table class="tableOne">
  <tr>
    <td>Row One</td>
    <td>45</td>
    <td>23.356</td>  
    <td>88</td>
  </tr>
  <tr>
    <td>Row Two</td>    
    <td>111440.568</td>
    <td>115555</td>
    <td>4.21598</td>
  </tr>
  <tr>
    <td>Row Three</td>    
    <td>27</td>
    <td>42</td>
    <td>144487.11</td>
  </tr>
  <tr>
    <td>Row Four</td>    
    <td>23.356</td> 
    <td>125%</td>   
    <td>778978523.36</td>   
  </tr>
</table>
<table class="tableTwo">
  <tr>
    <td>Row One</td>    
    <td>45</td>
    <td>23.356</td>  
    <td>Hello</td>
  </tr>
  <tr>
    <td>Row Two</td>    
    <td>111440.568</td>
    <td>115555</td>
    <td>4.21598</td>
  </tr>
  <tr>
    <td>Row Three</td>    
    <td>Dog</td>
    <td>true</td>
    <td>144487.11</td>
  </tr>
  <tr>
    <td>Row Four</td>    
    <td>23.356</td> 
    <td>125%</td>   
    <td>778978523.36</td>   
  </tr>
</table>

第一个没有字符串的表似乎没问题，第二个表的结果相差很远，我不确定总数是如何计算的。

Answer 1

你不能只对每个值执行parseInt，它有时会将字符串转换为奇怪的数字。在求和之前，您必须检查它是否不是有效数字。我想到了正则表达式或类似的东西，未经测试。

var v = $(val).text();
if(v.match(/^[\s0-9\.]+$/)){}