JavaScript: parseFloat неверно вычисляется

Question

Мне бы хотелось, чтобы каждый раз, когда установлен флажок (toppings), он обновляет цену, добавляя дополнительно 99 пенсов. Все работает отлично, за исключением случаев, когда пользователь выбирает 3 флажка (0,99 * 3) и отображает 2.9699999999999998 вместо 2.97

Какие-либо идеи о том, что не так?

HTML:

<label><b>Toppings (99p Each): &nbsp;</b></label><br> 
<input type="checkbox" name="onions">Onions</input><br> 
<input type="checkbox" name="mushrooms">Mushrooms</input><br> 
<input type="checkbox" name="peppers">Peppers</input><br> 
<input type="checkbox" name="olives">Olives</input><br> 
<input type="checkbox" name="garlic">Garlic</input><br> 
<input type="checkbox" name="xtra-cheese">Xtra Cheese</input><br> 
<input type="checkbox" name="peperoni">Peperoni</input><br> 

JavaScript:

var pizzaCost = 0.00; 
var toppingCost = 0.00; 

$('input[type=checkbox]').change(function(){ 
    var checked = $(":checkbox:checked").length; 
    var checkedInt = parseFloat(checked, 10); 
    var temp = (0.99 * checkedInt); 
    toppingCost = parseFloat(temp); 
    var total = pizzaCost + toppingCost; 
    $("#totalPrice").text(total); 
}); 

Answer 1

parseFloat Используется для преобразования строки в значение поплавка. В отличие от parseInt, parseFloatне имеют 2-й параметр.

JavaScript на самом деле не имеет разных типов для int и float, они одинаковы (и сохраняются внутри как float). Единственная разница между parseFloat и parseInt заключается в том, должен ли возвращаемый number иметь десятичный компонент или нет.

Что вы хотите использовать здесь: toFixed(), parseFloat здесь вообще не нужен. Нет строк, которые вам нужно проанализировать.

$('input[type=checkbox]').change(function(){ 
    var checked = $(":checkbox:checked").length; 
    toppingCost = 0.99 * checked; 

    var total = pizzaCost + toppingCost; 
    $("#totalPrice").text(total.toFixed(2)); 
}); 

Answer 2

попробовать: parseFloat(x).toFixed(2) дайте мне знать, если вам нужно что-то еще.

Answer 3

Номера с плавающей запятой редко бывают точными. Они работают, представляя число с наименьшей возможной ошибкой - немного похоже на сжатие. Это противоречит десятичным типам данных на некоторых языках, которые буквально хранят каждое число, например целое число, даже за десятичным.

Чем дольше поплавок, тем он точнее. Большинство поплавков представляют собой 32-битный вариант IEEE 754 standard, который имеет 23-битную мантиссу (дробную часть или точность) и 8-битный показатель, который по существу перемещает «плавающую» десятичную точку вдоль мантиссы.

Это означает, что 2.97 не может быть выражен с помощью поплавков без малейшего погрешности. Чтобы получить 2.97, вам нужно округлить результат до 2d.p. В JavaScript вы можете сделать это с

toppingCost.toFixed(2) 

Answer 4

здесь является идея умножить число с 100 затем разделите результат на 100: 0.99*100*3/100 https://jsfiddle.net/qp21bpbs/1/

Answer 5

parseFloat является для разбора строк плавать значения, чтобы получить некоторые отформатированные плавать, вы должны использовать toFixed, как это:

var pizzaCost = 0.00; 
var toppingCost = 0.00; 

$('input[type=checkbox]').change(function(){ 
    var checked = $(":checkbox:checked").length; 
    var checkedInt = parseFloat(checked, 10); 
    var temp = (0.99 * checkedInt); 
    toppingCost = +temp.toFixed(2); // Assuming 2 decimals 
    var total = pizzaCost + toppingCost; 
    $("#totalPrice").text(total); 
});