炫酷！JS 数值千分位 6 大招轻松搞定

2024-01-14 16:30:15

千分位格式化：让你的数字更吸睛

在日常生活中，我们经常需要对数字进行千分位分隔，比如金额、人口数量、统计数据等等。在 JavaScript 中，实现数字千分位分隔的方法有多种，本文将介绍 6 种常见的方法，帮助你让数字更易读、更吸引人。

1. 使用内置的 Number.toLocaleString() 方法

Number.toLocaleString() 方法是 JavaScript 中内置的一个强大工具，可以将数字格式化为特定区域的货币格式。我们可以利用这个方法轻松实现千分位分隔。

const number = 123456789.123456;
const formattedNumber = number.toLocaleString();
console.log(formattedNumber); // "123,456,789.123"

2. 使用字符串拼接的方法

字符串拼接的方法是一种简单直接的方式来实现千分位分隔。首先，将数字转换为字符串，然后从右向左每隔三位数字插入一个逗号，最后将字符串转换回数字。

const number = 123456789.123456;
const stringNumber = number.toString();
let formattedNumber = "";
for (let i = stringNumber.length - 1; i >= 0; i -= 3) {
  if (i === 0) {
    formattedNumber = stringNumber.substring(0, i + 1) + formattedNumber;
  } else {
    formattedNumber = "," + stringNumber.substring(i - 2, i + 1) + formattedNumber;
  }
}
console.log(formattedNumber); // "123,456,789.123"

3. 使用正则表达式的方法

正则表达式是一种强大的工具，可以用来匹配和替换字符串中的模式。我们可以使用正则表达式来实现千分位分隔。首先，将数字转换为字符串，然后使用正则表达式将字符串中的每三位数字匹配出来，并插入一个逗号，最后将字符串转换回数字。

const number = 123456789.123456;
const stringNumber = number.toString();
const formattedNumber = stringNumber.replace(/\B(?=(\d{3})+(?!\d))/g, ",");
console.log(formattedNumber); // "123,456,789.123"

4. 使用第三方库

JavaScript 生态系统中有很多第三方库可以帮助我们实现千分位分隔。比如，我们可以使用 "number-format" 库。这个库提供了多种格式化数字的方法，其中包括千分位分隔。

const number = 123456789.123456;
const formattedNumber = numberFormat(number, {
  thousandsSeparator: ",",
});
console.log(formattedNumber); // "123,456,789.123"

5. 使用自定义函数

如果你需要更灵活的千分位分隔功能，你可以创建一个自定义函数来实现。这个函数可以根据你的特定需要进行定制，比如指定分隔符、小数位数等。

function formatNumber(number, separator = ",") {
  const stringNumber = number.toString();
  let formattedNumber = "";
  for (let i = stringNumber.length - 1; i >= 0; i -= 3) {
    if (i === 0) {
      formattedNumber = stringNumber.substring(0, i + 1) + formattedNumber;
    } else {
      formattedNumber = separator + stringNumber.substring(i - 2, i + 1) + formattedNumber;
    }
  }
  return formattedNumber;
}

const number = 123456789.123456;
const formattedNumber = formatNumber(number);
console.log(formattedNumber); // "123,456,789.123"