传统做法

/**
 * 格式化数字，给数字添加逗号分隔符。
 * @param {number} number - 要格式化的数字。
 * @returns {string} - 格式化后带有逗号分隔符的字符串。
 */
function formatNumber(number) {
  // 将输入的数字转换为字符串
  const numberString = String(number);

  // 判断是否有效数字
  if (isNaN(number)) {
    return "Invalid number";
  }

  // 将数字转换为整数部分和小数部分
  const [integerPart, decimalPart] = numberString.split(".");

  // 格式化整数部分
  let formattedNumber = "";
  let count = 0;
  for (let i = integerPart.length - 1; i >= 0; i--) {
    formattedNumber = integerPart.charAt(i) + formattedNumber;
    count++;
    if (count % 3 === 0 && i !== 0) {
      formattedNumber = "," + formattedNumber;
    }
  }

  // 添加小数部分（如果有）
  if (decimalPart) {
    formattedNumber += "." + decimalPart;
  }

  return formattedNumber;
}

JS原生API调用

toLocalString详情

function formatNumber(number) {
  // 判断是否有效数字
  if (isNaN(numericValue)) {
    return "Invalid number";
  }

  // 将数字转换为字符串，并使用toLocaleString添加逗号分隔符
  const formattedNumber = numericValue.toLocaleString();

  return formattedNumber;
}

正则表达式

/**
 * 格式化数字，给数字添加逗号分隔符。
 * @param {number} number - 要格式化的数字。
 * @returns {string} - 格式化后带有逗号分隔符的字符串。
 */
function formatNumber(number) {
 // 判断是否有效数字
  if (isNaN(number)) {
    return "Invalid number";
  }

  // 将输入的数字转换为字符串
  const numberString = String(number);

  // 使用正则表达式添加逗号分隔符
  const formattedNumber = numberString.replace(/\B(?=(\d{3})+(?!\d))/g, ",");

  return formattedNumber;
}

上面的正则表达式的意思是：

\B - 匹配一个非单词边界位置。

(?=...) - 正向前瞻，用于匹配某个位置后面跟着指定模式的情况。

(\d{3})+ - 匹配由三个数字组成的连续子串，其中 {3} 表示匹配前面的模式恰好出现三次。

(?!\d) - 负向前瞻，用于确保匹配的位置后面不跟着数字。

g - 全局标志，表示匹配所有符合条件的位置，而不仅仅是第一个匹配。

现在我们来解释一下这个正则表达式的含义。它的主要目的是匹配数字字符串中逗号分隔的位置。

\B(?=(\d{3})+(?!\d)) 的意思是：

• \B 匹配一个非单词边界，确保不会在单词内部匹配。
• (?=(\d{3})+(?!\d)) 是一个正向前瞻，它匹配一个位置，该位置后面跟着一组由三个数字组成的连续子串，并且后面没有紧跟着数字。