在JS中用更现代化和优雅的方式进行金额的格式化

今天介绍一种我已经使用了很长时间的，针对现代浏览器的金额文本格式化方法。

这种方法使用了 Intl.NumberFormat (MDN) 这个API。

以人民币为例

const amountFormatter = new Intl.NumberFormat('en-US', { style: 'currency', currency: 'CNY' })

/**
 * 1234567.12 to 1,234,567.12
 * @param amount
 */
export const formatAmount = (amount: number): string => {
  if (typeof amount === 'undefined') {
    return ''
  }
  return amountFormatter.format(amount).substr(3)
}

formatAmount('1234567.12') // => 1,234,567.12

通过上面这个方法，就可以获取常见的人民币展示形式 1,234,567.12。

如果你需要保留人民币符号，那就是下面这个方法

amountFormatter.format(amount).substr(2)
// 1234567.12 to ¥1,234,567.12

事实上 format 方法输出的字符串是 CN¥1,234,567.12 ，因此你可以根据自己的需要进行调整。

通过调整 locale 参数和 options 还可以组合出更多形式，尽情探索吧。