【JavaScript】数字处理工具（格式化数字、金额和百分比）

RumIV

已于 2024-07-23 15:23:05 修改

阅读量1.9k

点赞数 5

分类专栏： JavaScript/Ts 文章标签： javascript 开发语言

于 2024-07-03 15:45:53 首次发布

本文链接：https://blog.csdn.net/qq_40205510/article/details/140154143

版权

本文将介绍几个实用的JavaScript函数，用于格式化数字、货币和百分比。这些函数可以帮助你在处理数据时，轻松实现数字的标准化展示，增加可读性。

数字格式化

功能描述

formatNumber函数用于将数字或数字字符串格式化为指定精度的字符串形式。它支持设置是否使用千位分隔符、是否省略小数点后的零以及指定小数点后的精度。

参数说明

num: 需要格式化的数字或数字字符串。
precision: 小数点后的精度，默认为2。
omitTrailingZeros: 是否省略小数点后的零，默认为false。
useThousandSeparator: 是否使用千位分隔符，默认为true。
useAbbreviatedChineseUnit: 是否使用中文缩写单位（如万、亿），默认为false。
unit : 自定义单位，默认无单位。

代码实现

/**
 * 格式化数字，支持千位分隔符、指定精度、去除末尾无效零、使用中文缩写单位
 * @param {number|string} num - 要格式化的数字
 * @param {number} precision - 小数点后保留的位数，默认为2
 * @param {boolean} omitTrailingZeros - 是否去除末尾的无效零，默认为true
 * @param {boolean} useThousandSeparator - 是否使用千位分隔符，默认为true
 * @param {boolean} useAbbreviatedChineseUnit - 是否使用中文缩写单位（如万、亿），默认为false
 * @param {string} unit - 自定义单位，默认无单位
 * @returns {string} 格式化后的数字字符串
 */
const formatNumber = (
  num: number | string,
  precision = 2,
  omitTrailingZeros = true,
  useThousandSeparator = true,
  useAbbreviatedChineseUnit = false,
  unit = ""
): string => {
   
  num = convertToNumber(num);
  if (isNaN(num)) return "-";
  if (useAbbreviatedChineseUnit) {
   
    if (num >= 1e8) {
   
      num = num / 1e8;
      unit = "亿" + unit;
    } else if (num >= 1e4) {
   
      num = num / 1e4;
      unit = "万" + unit;
    }
  }
  let numStr = num.toFixed(precision);
  if (useThousandSeparator) {
   
    numStr = formatWithThousandsSeparator(numStr);
  }
  if (omitTrailingZeros) {
   
    numStr = numStr.replace(/(\.\d*?[1-9])0+$|\.0*$/, "$1");
  }
  return `${
     numStr}${
     unit ? " " + unit : ""}`;
};

货币格式化函数

功能描述

formatCurrency函数用于将数字或数字字符串格式化为货币形式。它支持指定货币单位，并能根据数字的大小自动添加“亿”或“万”的单位。

参数说明

num: 需要格式化的数字或数字字符串。
unit: 货币单位，默认为“元”。

代码实现

/**
 * 格式化货币，自动转换为“万”或“亿”单位
 * @param {number|string} num - 要格式化的数字
 * @param {string} unit - 货币单位，默认为“元”
 * @returns {string} 格式化后的货币字符串
 */
const formatCurrency = (num: number | string, unit = "元"): string => {
   
  num = convertToNumber(num);
  if (isNaN(num)) return "-";
  let amount = "";
  if (Math.abs(num) >= 1000000000.0) {
   
    num /= 100000000.0;
    amount = "亿";
  } else if (Math.abs(num) >= 100000.0