夕食費計算の問題文字列を整数に変換する

Question

私は文字列から数値に.valuesを変換するためにparseIntを使用しています。ただし、ユーザーが小数値を入力すると、出力はNaNになります。以下は私のコードです：

Dinner Cost:<input type="text" id="cost" /><br /><br /> 
Tax Rate:<input type="text" id="taxRate" /><br /><br /> 

<button id="btn">Determine Total Costs</button><br /><br /> 

<p id="para"></p> 

document.getElementById("btn").addEventListener('click', totalCosts); 

function totalCosts() { 

    var dinnerCosts = document.getElementById("cost").value; 
    var taxRate = document.getElementById("taxRate").value; 
    taxRate = parseInt(taxRate); 
    dinnerCosts = parseInt(dinnerCosts); 


    var taxCost = dinnerCosts * taxRate; 
    var totalCost = dinnerCosts + taxCost; 

    return document.getElementById("para").innerHTML = "Your dinner cost " + dinnerCosts + ", your tax costs " + taxCost + ", for a total cost of " + totalCost; 
} 

私は間違っていますか？これらのデフォルト文字列をparseIntではなく数値に変換するより合理的な方法はありますか？

ありがとうございます！

Answer 1

を

使用parseFloatは（）を使用することができこのJavascriptのシナリオで堅牢な型チェックを行うことは避けることです：

• un
  それ以外

  // 
  var vfftest  = 0.05;      // float 
  var viitest  = 3000;      // integer 
  var vssblank  = '';       // empty string 
  var vssnonblank = 'hello';     // non-empty string 
  var vddempty  = {};       // dictionary with no name-value pairs 
  var vddnonempty = {'alpha':1,'bravo':'two'}; // dictionary with name- value pairs 
  var vnull   = null;      // null 
  
  // check parseFloat 
  console.log(parseFloat(vssnonblank)); // NaN 
  console.log(parseFloat(vssblank)); // NaN 
  console.log(parseFloat(vfftest));  // 0.05 
  console.log(parseFloat(viitest));  // 3000 
  console.log(parseFloat(vnull));  // NaN 
  console.log(parseFloat(vddempty)); // NaN 
  console.log(parseFloat(vddnonempty)); // NaN 
  console.log(parseFloat(vnoExisto)); // EXCEPTION 
  

  参照してください。変数

• （辞書別名）JavaScriptのオブジェクトに宣言されていないプロパティ
• LnullがNaNここ

値シンプルかつ簡単な概要です

値を宣言しましたthisリンクを参照し、そのようなコンバージョンでの例外を回避する方法をご覧ください。

Answer 2

Numberコンストラクタは、リテラル番号を返すようにインスタンス化せずに直接使用できます。より良いプログラミングプラクティスとしてtaxRate = parseFloat(taxRate);

あなたは、このようなconversions.One簡単な方法で例外を回避する必要があります。また、あなたは代わりのparseInt（）使用法のparseFloat

document.getElementById("btn").addEventListener('click', totalCosts); 
 

 
function totalCosts() { 
 

 
    var dinnerCosts = document.getElementById("cost").value; 
 
    var taxRate = document.getElementById("taxRate").value; 
 
    taxRate = Number(taxRate); 
 
    dinnerCosts = Number(dinnerCosts); 
 

 

 
    var taxCost = dinnerCosts * taxRate; 
 
    var totalCost = dinnerCosts + taxCost; 
 

 
    return document.getElementById("para").innerHTML = "Your dinner cost " + dinnerCosts + ", your tax costs " + taxCost + ", for a total cost of " + totalCost; 
 
}

Dinner Cost:<input type="text" id="cost" /><br /><br /> 
 
Tax Rate:<input type="text" id="taxRate" /><br /><br /> 
 

 
<button id="btn">Determine Total Costs</button><br /><br /> 
 

 
<p id="para"></p>