如何使用模式格式化数值?

时间:2018-05-07 08:38:01

标签: javascript

我在JavaScript中找到了等同于Java's DecimalFormat的内容。我想格式化给定的数字值与给定的小数模式,如

"#,###.00"
"###.##"
"#,###.##"
"$#,##0.00"
"###,###.00"
"$###,###.00"
"###,###.###"
"####,####.000"

有没有办法实现它?

2 个答案:

答案 0 :(得分:1)

第1部分 - 格式化

我建议使用javascript本身支持的Intl.NumberFormat,尽管旧浏览器可能不支持它。看起来IE11有它,但不是android。

因此,如果你想支持美元,你只需要使用类似的东西

var dollarFormat = new Intl.NumberFormat('en-US', { style: 'currency', currency: 'USD' });
var amountInDollars = dollarFormat.format(123456.123);
// amountInDollars = "$123,456.12"

但是这也是你的选择,例如

var roundedDollars = dollarFormat.format(555.555);
// roundedDollars = "$555.56";

对于数字情况,只需使用不同的格式化程序。默认'en-US'添加逗号,小数前的小数和3个小数的限制。但这是可配置的。

var numberFormat = new Intl.NumberFormat('en-US');
var formatted = numberFormat.format(123456.123456);
// formatted = "123,456.123"
var numberFormat2decimals = new Intl.NumberFormat('en-US', { maximumFractionDigits: 2 });
var formatted2 = numberFormat2decimals.format(123456.123456);
// formatted2 = "123,456.12"

您可以设置分数,整数和有效数字的最大值和最小值,这也支持国际格式。由于它是原生的javascript,我认为如果你的平台支持它,这是一个很好的方法。

MDN是一个很好的参考:https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/NumberFormat

第2部分 - 0的

要在格式中实现0,您必须在传递给格式化程序之前修改该值。如果您需要最小小数金额,那么您可以使用.00之类的货币,货币格式化程序默认会这样做。如果您有不想要的分形数字,只需使用Math.trun()截断值。

var num = Math.trun(1234.1234);
// num = 1234

现在要将12345更改为12340,我们必须删除一些数值。我们可以通过转换为字符串,拉出最后一个字符并转换回来找到很多。

var num = 123456.12345;
var wholeNum = Math.trunc(num);
// wholeNum = 123456;
var toRemove = Number.parseInt(wholeNum.toString().slice(-1), 10);
// toRemove = 6
// slice(-1) gives us the right-most character of a string.
// Notice the ', 10' at the end, this is important to indicate which number base to use for parseInt. 
var wholeNumEnding0 = wholeNum - toRemove;
// wholeNumEnding0 = 123450

希望这是你想要完成的事情?我没有在这里进行任何四舍五入。

答案 1 :(得分:0)

注意:我快速输入,请原谅任何错误,也可能有更好的方法。

如果您不想依赖库,可以执行以下操作:

var number = 100000.00000000000012422;

function FormatNumber(no){

  no = no.toFixed(2);
  no = no.toString().split('.');

  var p1 = no[0];

  p1 = p1.substring(0, p1.length - 3) + ',' + p1.substring(p1.length - 3);

  no = p1 + '.' + no[1];

  console.log(no);

}

FormatNumber(number);

FormatNumber函数将一个数字作为参数(您可能希望扩展它以包括例如小数位)。它将数字转换为所需的小数位,将其转换为字符串并用小数分隔符“.”拆分。

下一步是从后面添加一个千位分隔符三个字符,然后只需将剩余的字符重新组合在一起。

JSFiddle

如果您希望每3个字符获得一个',',那么您可以编写一个更复杂的'格式化'格式器,具体内容如下:

  no = no.toFixed(2);
  no = no.toString().split('.');

  var p1 = no[0];

  var arr = [];

  arr = p1.split("").reverse().join("").match(/[\s\S]{1,3}/g) || [];
  arr = arr.reverse();

  p1 = "";

  for(var i = 0; i < arr.length; i++){
    p1 += arr[i].split("").reverse().join("");
        if(i != arr.length - 1){
           p1 += ',';
        }
  }


  no = p1 + '.' + no[1];

此方法按每个数字将数字拆分为数组,反转数组,因为我们需要从字符串的末尾开始以获得准确的结果。

然后我们通过再次将数字拆分为数组,将数字反转并重新连接在一起然后追加到p1来迭代具有3个或更少值的字符串数组。如果它是最后一项,则不会添加逗号。

最后我们取小数并附加到构建的字符串。

JSFiddle