我想格式化我的数字,总是显示2小数点后,四舍五入适用的地方。

例子:

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

我一直在用这个:

parseFloat(num).toFixed(2);

但是它把1显示为1,而不是1.00。


当前回答

你是这个意思吗?

@razu提供的答案是最好的。这是一个稍微重构的版本。

代码片段仍然不能返回类似showAsFloat(2.3346)的正确值(结果2.33,但应该是2.34)。所以,也看。

const showAsFloat = (input, decimals = 2, asString = false) => { if (input === null || input.constructor === Boolean || isNaN(+input)) { return input; } const converted = +( `${Math.round( parseFloat( `${input}e${decimals}` ) )}e-${decimals}` ); return asString ? converted.toFixed(decimals) : converted }; 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, true)| ' + showAsFloat('24568', 5, true), 'showAsFloat(2456198, 5) | ' + showAsFloat('24568', 5), 'showAsFloat(0, 2, true); | ' + showAsFloat(0, 2, true), 'showAsFloat(1.345); | ' + showAsFloat(1.345), 'showAsFloat(0.005); | ' + showAsFloat(0.005), 'showAsFloat(null); | ' + showAsFloat(null), ].join('\n'); <pre id="result"></pre>

其他回答

(Math.round(num * 100) / 100).toFixed(2);

现场演示

var num1 = “1”; document.getElementById('num1').innerHTML =(Math.round(num1 * 100) / 100).toFixed(2); var num2 = “1.341”; document.getElementById('num2').innerHTML =(Math.round(num2 * 100) / 100).toFixed(2); var num3 = “1.345”; document.getElementById('num3').innerHTML =(Math.round(num3 * 100) / 100).toFixed(2); 跨度 { 边框:1px 实心 #000; 边距:5px; 填充:5px; } <span id=“num1”></span> <span id=“num2”></span> <span id=“num3”></span>

注意,它将四舍五入到小数点后2位,因此输入1.346将返回1.35。

一个更通用的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

对于现代浏览器,使用toLocaleString:

var num = 1.345;
num.toLocaleString(undefined, { maximumFractionDigits: 2, minimumFractionDigits: 2 });

指定区域设置标记作为控制十进制分隔符的第一个参数。对于点,使用例如English U.S. locale:

num.toLocaleString("en-US", { maximumFractionDigits: 2, minimumFractionDigits: 2 });

这使:

1.35

大多数欧洲国家使用逗号作为小数分隔符,所以如果你使用瑞典/瑞典地区:

num.toLocaleString("sv-SE", { maximumFractionDigits: 2, minimumFractionDigits: 2 });

它会给:

1, 35

在进行toFixed()调用之前,我必须在parseFloat()和Number()转换之间做出决定。下面是一个捕获用户输入后进行数字格式化的示例。

HTML:

<input type="number" class="dec-number" min="0" step="0.01" />

事件处理程序:

$('.dec-number').on('change', function () {
     const value = $(this).val();
     $(this).val(value.toFixed(2));
});

上述代码将导致TypeError异常。注意,虽然html输入类型是“数字”,但用户输入实际上是“字符串”数据类型。但是,toFixed()函数只能在Number类型的对象上调用。

最终代码如下所示:

$('.dec-number').on('change', function () {
     const value = Number($(this).val());
     $(this).val(value.toFixed(2));
});

我倾向于使用Number() vs. parseFloat()强制转换的原因是,我不需要对空输入字符串或NaN值执行额外的验证。Number()函数将自动处理空字符串并将其转换为零。

你可以试试下面的代码:

    function FormatNumber(number, numberOfDigits = 2) {
        try {
            return new Intl.NumberFormat('en-US').format(parseFloat(number).toFixed(numberOfDigits));
        } catch (error) {
            return 0;
        }
    }

    var test1 = FormatNumber('1000000.4444');
    alert(test1); // 1,000,000.44

    var test2 = FormatNumber(100000000000.55555555, 4);
    alert(test2); // 100,000,000,000.5556