Формат номера, чтобы всегда показывать 2 десятичных знака - PullRequest
Новая
       137

Формат номера, чтобы всегда показывать 2 десятичных знака

652 голосов
/ 26 мая 2011

Я хотел бы отформатировать свои числа, чтобы всегда отображать 2 десятичных знака с округлением, где это применимо.

Примеры: 

number     display
------     -------
1          1.00
1.341      1.34
1.345      1.35

Я использовал это: 

parseFloat(num).toFixed(2);

Но он отображает 1 как 1, а не 1.00.

Ответы [ 28 ]

939 голосов
/ 26 мая 2011

Это отлично работает в FF4: 

parseFloat(Math.round(num3 * 100) / 100).toFixed(2);

Live Demo 

var num1 = "1";
document.getElementById('num1').innerHTML = parseFloat(Math.round(num1 * 100) / 100).toFixed(2);

var num2 = "1.341";
document.getElementById('num2').innerHTML = parseFloat(Math.round(num2 * 100) / 100).toFixed(2);

var num3 = "1.345";
document.getElementById('num3').innerHTML = parseFloat(Math.round(num3 * 100) / 100).toFixed(2);
span {
    border: 1px solid #000;
    margin: 5px;
    padding: 5px;
}
<span id="num1"></span>
<span id="num2"></span>
<span id="num3"></span>

Обратите внимание, что он будет округлять до 2 десятичных знаков, поэтому вход 1.346 вернет 1.35.

267 голосов
/ 08 ноября 2012 
Number(1).toFixed(2);         // 1.00
Number(1.341).toFixed(2);     // 1.34
Number(1.345).toFixed(2);     // 1.34 NOTE: See andy's comment below.
Number(1.3450001).toFixed(2); // 1.35


document.getElementById('line1').innerHTML = Number(1).toFixed(2);
document.getElementById('line2').innerHTML = Number(1.341).toFixed(2);
document.getElementById('line3').innerHTML = Number(1.345).toFixed(2);
document.getElementById('line4').innerHTML = Number(1.3450001).toFixed(2);
<span id="line1"></span>
<br/>
<span id="line2"></span>
<br/>
<span id="line3"></span>
<br/>
<span id="line4"></span>
78 голосов
/ 24 августа 2015

Этот ответ потерпит неудачу, если value = 1.005.

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

Number(Math.round(1.005+'e2')+'e-2'); // 1.01

Чистый код, предложенный @Kon и первоначальным автором: 

Number(Math.round(parseFloat(value + 'e' + decimalPlaces)) + 'e-' + decimalPlaces)

Кредит: Десятичные знаки округления в JavaScript

18 голосов
/ 07 сентября 2012 
var num = new Number(14.12);
console.log(num.toPrecision(2));//outputs 14
console.log(num.toPrecision(3));//outputs 14.1
console.log(num.toPrecision(4));//outputs 14.12
console.log(num.toPrecision(5));//outputs 14.120
12 голосов
/ 08 апреля 2013

Простейший ответ: 

var num = 1.2353453;
num.toFixed(2); // 1.24

Пример: http://jsfiddle.net/E2XU7/

12 голосов
/ 06 сентября 2017

Гораздо более универсальное решение для округления до N мест 

function roundN(num,n){
  return parseFloat(Math.round(num * Math.pow(10, n)) /Math.pow(10,n)).toFixed(n);
}


console.log(roundN(1,2))
console.log(roundN(1.34,2))
console.log(roundN(1.35,2))
console.log(roundN(1.344,2))
console.log(roundN(1.345,2))
console.log(roundN(1.344,3))
console.log(roundN(1.345,3))
console.log(roundN(1.3444,3))
console.log(roundN(1.3455,3))

Output

1.00
1.34
1.35
1.34
1.35
1.344
1.345
1.344
1.346
11 голосов
/ 14 января 2016

Для наиболее точного округления создайте эту функцию: 

function round(value, decimals) {
    return Number(Math.round(value +'e'+ decimals) +'e-'+ decimals).toFixed(decimals);
}

и используйте его для округления до 2 десятичных знаков: 

console.log("seeked to " + round(1.005, 2));
> 1.01

Благодаря Razu , этой статье и справке MDN по математике .

9 голосов
/ 09 ноября 2012

Если вы уже используете jQuery, вы можете использовать плагин jQuery Number Format .

Плагин может возвращать отформатированные числа в виде строки, вы можете установить десятичные разделители и разделители тысяч, а также выбрать количество отображаемых десятичных знаков. 

$.number( 123, 2 ); // Returns '123.00'

Вы также можете получить jQuery Number Format от GitHub .

9 голосов
/ 28 ноября 2015 
var number = 123456.789;


console.log(new Intl.NumberFormat('en-IN', { maximumFractionDigits: 2 }).format(number));

https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/NumberFormat

7 голосов
/ 26 мая 2011

Это то, что вы имеете в виду? 

function showAsFloat(num, n){
      return !isNaN(+num) ? (+num).toFixed(n || 2) : num;
}

document.querySelector('#result').textContent = 
    [
     'command                      | result',
     '-----------------------------------------------',
     'showAsFloat(1);              | ' + showAsFloat(1),
     'showAsFloat(1.314);          | ' + showAsFloat(1.314),
     'showAsFloat(\'notanumber\')    | ' + showAsFloat('notanumber'),
     'showAsFloat(\'23.44567\', 3)   | ' + showAsFloat('23.44567', 3),
     'showAsFloat(2456198, 5)      | ' + showAsFloat('2456198', 5),
     'showAsFloat(0);              | ' + showAsFloat(0)
    ].join('\n');
Страница:
...