js 金额格式化|极客笔记

js 金额格式化

在前端开发中，经常会涉及到对金额进行格式化显示的需求，例如将数字金额转换为符合要求的格式，比如添加千位分隔符或保留特定位数小数等。在本文中，我们将介绍如何使用 JavaScript 对金额进行格式化。

1. 添加千位分隔符

首先，我们来实现将数字添加千位分隔符的功能。我们可以通过正则表达式来实现这个功能，下面是代码实现：

function addCommas(nStr) {
  nStr += '';
  const x = nStr.split('.');
  let x1 = x[0];
  const x2 = x.length > 1 ? '.' + x[1] : '';
  const rgx = /(\d+)(\d{3})/;
  while (rgx.test(x1)) {
    x1 = x1.replace(rgx, ' $1' + ',' + '$ 2');
  }
  return x1 + x2;
}

const amount = 1234567.89;
const formattedAmount = addCommas(amount);
console.log(formattedAmount); // 输出 "1,234,567.89"

在上面的代码中，addCommas 函数的参数 nStr 为待格式化的数字，我们首先将其转换为字符串，然后使用正则表达式来匹配数字的千位分隔符，最后返回格式化后的金额。

2. 保留特定位数小数

除了添加千位分隔符外，有时候我们还需要对金额进行小数位的处理。下面是一个保留特定位数小数的示例代码：

function formatDecimal(num, decimal) {
  const multiplier = Math.pow(10, decimal);
  return Math.round(num * multiplier) / multiplier;
}

const amount = 1234.56789;
const formattedAmount = formatDecimal(amount, 2);
console.log(formattedAmount); // 输出 "1234.57"

在上面的代码中，formatDecimal 函数接受两个参数，分别为待格式化的数字 num 和要保留的小数位数 decimal。我们先将数字乘以 10 的 decimal 次方取整，然后再除以相同的倍数，得到保留特定位数小数的结果。

3. 结合两种格式化方式

有时候，我们需要同时对金额进行千位分隔符和小数位处理。下面是一个结合两种格式化方式的示例代码：

function formatAmount(amount, decimal) {
  const formattedAmount = addCommas(amount);
  return formatDecimal(formattedAmount, decimal);
}

const amount = 1234567.89123;
const formattedAmount = formatAmount(amount, 2);
console.log(formattedAmount); // 输出 "1,234,567.89"

在上面的代码中，formatAmount 函数先使用 addCommas 函数添加千位分隔符，然后再调用 formatDecimal 函数处理小数位，最终返回格式化后的金额。