數字值格式，帶逗號和兩個小數點

Question

我正在使用chart.js來顯示我的銷售額，問題是我無法將數據正確轉換為帶有逗號和兩位小數的數字格式。

當數據為整數時，輸出正確。 但是，當我顯示平均銷售額時，我得到的輸出是

平均銷售（無格式）1000.2017
平均銷售（含格式）1,000.2,017
總銷售（無格式）1000
總銷售（含格式）1,000

如何在javascript中正確格式化輸出？

tooltips: {
  callbacks: {
     label: function(tooltipItem, data) {
         var value = data.datasets[0].data[tooltipItem.index];
         value = value.toString();
         value = value.replace(/\B(?=(\d{3})+(?!\d))/g, ",");
              return value;
           }
       }
  },
   scales: {
     yAxes: [{
       ticks: {
         userCallback: function(value, index, values) {
           value = value.toString();
           value = value.replace(/\B(?=(\d{3})+(?!\d))/g, ",");
              return value;
         }
        }
    }]
}

Answer 1

Javascript為您提供了一些解決方案。 下面是前兩個。

1. number.toLocaleString

如前所述，.toLocaleString可以幫助你，但不是minimumFractionDigits使用maximumFractionDigits 。

如下所示：

number.toLocaleString(undefined, { maximumFractionDigits: 2 })

總結一下：

const decimalsFormated = number.toLocaleString(undefined, { maximumFractionDigits: 2 })

然后

const finalFormated = String(decimalsFormated).replace(/\B(?=(\d{3})+(?!\d))/g, ",");

2. Number.parseFloat +固定

let number = 123.1234
Number.parseFloat(number).toFixed(2);

在每種方法中，最好將解決方案包裝在函數中：

function getCommaSeparatedTwoDecimalsNumber(number) {
    const fixedNumber = Number.parseFloat(number).toFixed(2);
    return String(fixedNumber).replace(/\B(?=(\d{3})+(?!\d))/g, ",");

}

您也可以使用正則表達式。 我會說這太過復雜了。

同樣要注意的很重要的一點是，您可能會或可能不想舍入最終結果。

與maxDigits一起使用toLocaleString只會刪除這兩位數字之后的所有內容。 使用toFixed會使輸出不正確。

此解決方案將正確地將其取整：

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

從此處粘貼： 格式化數字以始終顯示小數點后兩位

最后一件事，可能是最重要的。 根據輸入數字的格式，上述解決方案可能會或可能不會起作用。 您需要確定輸入格式，如果無法預見，請為每種可能性提供格式化程序：

1000000.123124

10000123123

100000,1239

1.12039

1,19012

等等

並且根據格式，您需要采取的操作順序可能會有所不同。

Answer 2

您可以像這樣嘗試使用toLocaleString：

value = value.toLocaleString(undefined, { maximumFractionDigits: 2 });

它將根據您的語言環境格式化數字，並以千位分隔符和逗號后兩位數字表示。

Answer 3

您在尋找什么：

• 逗號
• 不論數字，小數點后兩位。

這是您的功能：

function get4DecimalPointsWithCommas(amount) {
    return amount.toLocaleString(undefined, { maximumFractionDigits: 4, minimumFractionDicits: 4 });
}