JavaScript数值千分位格式化的两种简单实现方法

作者:jingxian 时间:2023-08-31 22:59:43 

在对数值进行格式化的时候,一个常见的问题是按照千分位格式化,网上对这个问题已经有很多种解决方法了,还可以利用Array.prototype.reduce方法来实现千分位格式化。


function formatNumber(num) {
 if (isNaN(num)) {
   throw new TypeError("num is not a number");
 }

var groups = (/([\-\+]?)(\d*)(\.\d+)?/g).exec("" + num),
   mask = groups[1],            //符号位
   integers = (groups[2] || "").split(""), //整数部分
   decimal = groups[3] || "",       //小数部分
   remain = integers.length % 3;

var temp = integers.reduce(function(previousValue, currentValue, index) {
   if (index + 1 === remain || (index + 1 - remain) % 3 === 0) {
     return previousValue + currentValue + ",";
   } else {
     return previousValue + currentValue;
   }
 }, "").replace(/\,$/g, "");
 return mask + temp + decimal;
}

Array的reduce方法在IE9以下不支持,不过,我们可以基于ECMAScript 3来实现一个reduce方法。

在JavaScript中,字符串的replace方法的匹配模式参数除了字符串以外还可以是一个正则表达式,下面是利用String.prototype.replace方法来实现千分位格式化的具体代码:


function formatNumber(num) {
 if (isNaN(num)) {
   throw new TypeError("num is not a number");
 }

return ("" + num).replace(/(\d{1,3})(?=(\d{3})+(?:$|\.))/g, "$1,");  
}

(\d{1,3})是一个捕获分组,可以用$1来反向引用,?=(\d{3})+(?:$|\.)是正向断言,表示匹配1到3个数字后面必须跟3个数字,但不含最后的3个数字或者3个数字和小数点。

标签:JavaScript,千分位,格式化
0
投稿

猜你喜欢

  • python利用多线程+队列技术爬取中介网互联网网站排行榜

    2023-05-19 08:17:21
  • mysql获取字符串长度函数(CHAR_LENGTH)

    2024-01-26 02:42:51
  • Javascript fso操作文件

    2008-07-30 12:51:00
  • Python办公自动化批量处理文件实现示例

    2021-01-12 01:11:24
  • 详解如何使用Python编写vim插件

    2023-01-08 13:30:39
  • Oracle实现动态SQL的拼装要领

    2024-01-15 07:38:23
  • 基于Python实现抢注大词的提词工具

    2022-04-07 02:00:20
  • Python Web开发模板引擎优缺点总结

    2023-08-02 22:36:29
  • 如何在 IE 中使用 HTML5 元素

    2009-06-14 19:44:00
  • 详解Python 数据库 (sqlite3)应用

    2024-01-21 06:14:46
  • 12个对网页设计师非常有用的图片优化工具[译]

    2009-09-22 14:29:00
  • go goroutine 怎样进行错误处理

    2024-05-22 10:14:39
  • Node.js中的events事件模块知识点总结

    2024-05-08 10:11:37
  • 最新idea2021最新激活超详细教程

    2023-08-08 01:50:17
  • Python装饰器(decorator)定义与用法详解

    2022-07-21 03:11:25
  • 一个小时内学习 SQLite 数据库

    2012-05-22 18:51:30
  • 详解vue中的computed的this指向问题

    2024-04-27 15:46:56
  • SQL 字母数字混合型字段 按里面的数字排序

    2010-04-23 18:18:00
  • 自动完成autoComplete

    2011-01-17 18:01:00
  • 关于H1的用法探讨

    2008-03-18 12:55:00
  • asp之家 网络编程 m.aspxhome.com