JavaScript, отображающий число с плавающей точкой до 2 десятичных знаков

316

Я хотел отобразить число до 2 десятичных знаков.

Я думал, что мог бы использовать toPrecision(2)в JavaScript.

Однако, если номер есть 0.05, я получу 0.0500. Я бы предпочел, чтобы это осталось прежним.

Смотрите это на JSbin .

Каков наилучший способ сделать это?

Я могу подумать о кодировании нескольких решений, но я представляю (надеюсь) что-то вроде этого встроенное?

Алекс
источник

Ответы:

560
float_num.toFixed(2);

Примечание:toFixed() будет округлять или дополнять нулями, если необходимо, чтобы соответствовать указанной длине.

Джейсон МакКрири
источник
61
Но он возвращает строку, а не float!
Анвар
38
Автор вопроса хочет «отобразить» его, поэтому строка идеально подходит
Кристоф Маруа
7
И вы всегда можете использовать parseFloat (float_num.toFixed (2)), чтобы преобразовать строку обратно в float, сохраняя при этом только два десятичных знака.
Hankrecords
3
@anwar, вы не можете надежно округлить поплавок (возможно, вы можете округлить поплавок вообще) - вы получите что-то вроде 0,0500 или даже 0,0500000000001. См floating-point-gui.de
СВК
2
@Hankrecords то, что вы сказали, не соответствует действительности. Если у меня есть «43,01», и я parseFloat, то я получу 43,01 НО, если у меня «43,10», я получу 43,1: D не то, что я хочу.
Лучиан Тарна
50

Вы можете сделать это с помощью toFixedфункции, но в IE она глючит . Если вам нужно надежное решение, посмотрите мой ответ здесь .

Элиас Замария
источник
26
Технология должна развиваться, а не адаптироваться к IE ... (кстати, в узле js float_num.toFixed(2);работает нормально)
fider
14

Не знаю, как я добрался до этого вопроса, но даже если прошло много лет с тех пор, как мне его задали, я хотел бы добавить быстрый и простой метод, которому я следую, и он никогда не подводил меня:

var num = response_from_a_function_or_something();

var fixedNum = parseFloat(num).toFixed( 2 );
панорам
источник
1
Почему parseFloat()там? Его следует использовать только в том случае, если число исходит из строки.
Алекс
3
В некоторых случаях, когда я получаю какое-то значение атрибута «data-» с помощью jquery из элемента, если я использую только toFixed, это вызывает ошибку. ParseFloat исправляет это.
Panos
2
Да, это то , что я имел в виду выше , если он пришел из строки . Но использовать это всегда плохой совет.
Алекс
8

number.parseFloat(2) работает, но возвращает строку.

Если вы хотите сохранить его как тип номера, вы можете использовать:

Math.round(number * 100) / 100

rnmalone
источник
4

Вы можете попробовать смешать Number()и toFixed().

Преобразуйте целевое число в красивую строку с цифрами X, а затем преобразуйте форматированную строку в число.

Number( (myVar).toFixed(2) )


Смотрите пример ниже:

var myNumber = 5.01;
var multiplier = 5;
$('#actionButton').on('click', function() {
  $('#message').text( myNumber * multiplier );
});

$('#actionButton2').on('click', function() {
  $('#message').text( Number( (myNumber * multiplier).toFixed(2) ) );
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<button id="actionButton">Weird numbers</button>
<button id="actionButton2">Nice numbers</button>

<div id="message"></div>

Джордж-Пол Б.
источник
Спасибо за хорошую ссылку.
Арман Х
1

toFixed()Метод форматирует число с использованием нотации с фиксированной точкой.

а вот и синтаксис

numObj.toFixed([digits])

Аргумент digits является необязательным и по умолчанию равен 0. И тип возвращаемого значения - строка, а не число. Но вы можете преобразовать его в число, используя

numObj.toFixed([digits]) * 1

Он также может генерировать исключения, такие как TypeError,RangeError

Вот полная детализация и совместимость в браузере.

Сунил Гарг
источник
-1

Я сделал эту функцию. Работает нормально, но возвращает строку.

function show_float_val(val,upto = 2){
  var val = parseFloat(val);
  return val.toFixed(upto);
}
Саид Нурул Ислам
источник