15、JS实现数字千分位格式化

数字千分位格式化

• 将数字千分位格式化，输出字符串
• 如输入数字12050100，输出字符串12,050,100
• （注意：逆序判断）

常见思路

• 转换为数组，reverse，每3位拆分
• 使用正则表达式
• 使用字符串拆分

代码实现

• 数组方式

export function numFormat1 (n:number):string {
  n = Math.floor(n) // 只考虑整数
  const s = n.toString()
  const arr = s.split('').reverse()

  return arr.reduce((prev,val,idx) =>{
    if (idx % 3 === 0) {
      if (prev) {
        return val + ',' + prev
      } else {
        return val
      }
    } else {
      return val + prev
    }
  },'')
}

• 字符串方式

export function numFormat2 (n:number):string {
  n = Math.floor(n) // 只考虑整数
  const s = n.toString()
  const len = s.length
  let res = ''
  
  for (let i = len -1; i >= 0; i--) {
    const j = len - i

    if (j % 3 === 0) {
      if (i === 0) {
        res = s[i] + res
      } else {
        res = ',' + s[i] + res
      }
    } else {
      res = s[i] + res
    }
  }

  return res
}

功能测试

const n = 12050100
console.log(numFormat1(n)) 
console.log(numFormat2(n))

打印结果

12,050,100
12,050,100

性能测试

console.time('numFormat1')
for (let i = 0; i < 100 * 10000; i++) {
  numFormat1(i)
}
console.timeEnd('numFormat1')

console.time('numFormat2')
for (let i = 0; i < 100 * 10000; i++) {
  numFormat2(i)
}
console.timeEnd('numFormat2')

打印结果

numFormat1: 249.857ms
numFormat2: 105.373ms

性能分析

• 使用数组，转换影响性能
• 使用正则表达式，性能较差
• 使用字符串，性能较好——推荐答案

总结

• 顺序：从尾到头
• 尽量不要转换数据结构
• 慎用正则表达式