Javascript parseFloat（）はNaNを返すことがあります - 古いバージョンのFirefoxの場合

Question

私はこのアプリケーションを現在の主要なブラウザすべてでテストしており、信頼性が高く正しく動作します。アプリがデプロイされました。結果がNaNになることがあるという報告があります。

以下の関数は、parsefloat（）を使用してテーブル内の価格列の合計を求めます。その合計がNaNとして表示されることがあります。私はそれを再現することができず、これまでに問題を報告している顧客は、彼らがどのブラウザを使用しているかを私に教えるのに技術的に十分な能力がありませんでした。ある人がMac上でFirefoxのスクリーンショットを送ったが、もう1人はWindows上でFirefoxだった。以下のコードで

、この行：

var linePrice = rows[i].cells[gTblLinePriceCol].innerHTML.substr(1); 

が正しく6.50にlinePriceを設定し、innerHTMLプロパティの値が "$ 6.50" です。次の行はparseFloat（linePrice）を呼び出します。

最後に、この行：

document.getElementById('totalPrice').innerHTML = tableTotal.toLocaleString('us-US', { style: 'currency', currency: 'USD' }); 

はNaNではなく、列合計を表示させます。

ご協力いただければ幸いです！ここで

コードは次のとおりです。

function totalTbl() 
    { 
    var table = document.getElementById('myTbl'); 
    var rows = table.getElementsByTagName('tr'); 

    var tableTotal = 0; 

    // Skip the first (header) row and the last (add row) row 
    len = rows.length - 2; 
    numRows = len - 1; 

    for (var i = 1; i < len; i++) 
    { 
     var cell = rows[i].cells[5]; 
     if (cell.firstChild != null) 
     { 
     var linePrice = rows[i].cells[gTblLinePriceCol].innerHTML.substr(1); 

     tableTotal += parseFloat(linePrice); 
     } 
    } 

    document.getElementById('totalPrice').innerHTML = tableTotal.toLocaleString('us-US', { style: 'currency', currency: 'USD' }); 

    } 

Answer 1

私は、検討する多くのコードなしで発生しているあなたのコード内の1つのポイントを見つけるのは難しいだろうと感じたので、私はいくつかに対処しようとしますうまくいけば、私たちはこの問題にぶつかります。

まず、!=または==を使用しないでください。これは、タイプ強制を実行します。このルールは、直感的であり、記憶不能であり、単純に避けるのが最良です。代わりに、常にタイプ強制を実行しない===または!==を使用してください。タイプ強制を実行したい場合、私は明示的にそれを行います。

これらの値がユーザーの入力によって提供されている場合は、.substrなどの単純なソリューションを使用しないと主張し、代わりに/\d+(.\d*)?/などの正規表現を使用します。ユーザーからの入力でない場合は、おそらく安全です。

第3に、私が最も疑っているのは、問題です。toLocaleStringです。 toLocaleStringは、さまざまなブラウザによって提供されるさまざまな実装のために、関数としてかなり信頼できませんでした。私はMacを使い、Chromeは$7.50を作り、FirefoxはUS$7.50を作ります。これらはそうであるように見えますが、これらのブラウザの古いバージョンでは可能性のある問題を示唆しています。また、簡単な文字列操作を試みるとすぐに問題に遭遇します。 toLocaleStringを安全かつ簡潔なソリューションに置き換えることはかなり簡単です。

document.getElementById('totalPrice').innerHTML = '$' + tableTotal.toFixed(2)

これはtypeof tableTotal === 'number'を前提とし、そうでなければ、単に型の強制を実行するために(+tableTotal).toFixed(2)を行う必要があります。

幸運にも、私があなたの問題を解決したかどうか教えてください。