JavaScript数值千分位格式化的两种方法

在对数值进行格式化的时候,一个常见的问题是按照千分位格式化,网上对这个问题已经有很多种解决方法了,还可以利用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方法,具体请参考MDN上关于Array.prototype.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个数字和小数点。

时间: 2024-08-14 03:11:55

JavaScript数值千分位格式化的两种方法的相关文章

Javascript使用function创建类的两种方法

1.使用function类 //myFunction.js var CMyFunc=function() { //类的公共方法,供外部调用 this.Func1=function() { var i=0; return i; } this.Func2=function() { _privateFunc(); } //类中的私有方法,供公共方法调用 function _privateFunc() { return 0; ] } CMyFunc myFunc=new CMyFunc(); 使用:其它

Javascript屏蔽鼠标的右键的两种方法。

方法一:利用鼠标button的键值 <script language="javascript"> function blockright(oEvent) { var oDiv = document.getElementById("display"); if (window.event) oEvent = window.event; //处理兼容性,获得事件对象 if (oEvent.button == 2) alert("不能使用")

AngularJS的日期格式化有两种形式

AngularJS的日期格式化有两种形式,一种是在HTML页面,一种是在JS代码里,都是用到AngularJS的过滤器$filter. HTML: date_expression 即 你在$scope中设的date类型变量(注意,一定是date object才正确), 也是要显示出来的日期,|是分割符号,分割符号后面的第一个参数date是指明过滤器类型是过滤日期的,第二个参数format是你的日期要格式化成什么样子,比如yyyy-MM-dd,最后timezone一个是时区(可选参数),对于国际化

[js开源组件开发]数字或金额千分位格式化组件

数字或金额千分位格式化组件 这次距离上一个组件<[js开源组件开发]table表格组件>时隔了一个月,由于最近的项目比较坑,刚挖完坑,所以来总结性提出来几个组件弥补这次的空缺,首先是金额和数字的千分位和小数点控制的组件,它的作用主要是在输入框时限制输入的内容为数字.也可以用于普通标签的数字格式化,效果如下图: demo演示地址请点击 http://www.lovewebgames.com/jsmodule/format-number.html 源码github托管地址请点击https://gi

Python 中格式化字符串 % 和 format 两种方法之间的区别

Python2.6引入了 format 格式化字符串的方法,现在格式化字符串有两种方法,就是 % 和 format ,具体这两种方法有什么区别呢?请看以下解析. # 定义一个坐标值 c = (250, 250) # 使用%来格式化 s1 = "敌人坐标:%s" % c 上面的代码很明显会抛出一个如下的TypeError: TypeError: not all arguments converted during string formatting 像这类格式化的需求我们需要写成下面丑陋

javascript获取json对象的key名称的两种方法

javascript获取json对象的key名称的两种方法 数据处理中,你可能接收到一个不确定内容格式的json对象,然后要把key的值提取出来.今天试过两种可以提取json key的方法,均可以正常工作. 先看第一种方法 jsonObj = { Name: 'richard', Value: '8' }for (key in jsonObj){ console.log(key); //add your statement to get key value} 结果 NameValue 第二种方法

JavaScript强化教程——DOM编程(两种控制div移动的方法)

本文为H5EDU机构官方HTML5培训教程,主要介绍:JavaScript强化教程--DOM编程(两种控制div移动的方法) 第一种 按钮控制首先 创建两个html按钮和一个div并给div一个样式 input type="button" value="左" id="1"> <input type="button" value="右" id="2"> <div i

javascript 判断数组中的重复内容的两种方法 by FungLeo

javascript 判断数组中的重复内容的两种方法 by FungLeo 前言 一般,我们可能会给数组去重,这个操作并不复杂,执行一个循环就是了.现在,我要做的是,判断数组中是否有重复的内容,如果有,返回 true 否则,返回 false. 思路 把数组变成字符串 循环原数组,拿每一个字段和这个字符串进行比对,看是否有重复 如何拿A字符串和B字符串进行对比,并且要求判断出B字符串中包含过个A字符串呢? 方法一 indexOf() 和 lastIndexOf() 对比法. 首先,我们构建代码:

快速生成较大文本文档的两种方法

在学习用FTP发送文件的过程中,需要用到一个比较大的文件进行传输测试.因此百度了一下如何生成指定大小文件的方法,发现在WINDOWS下有两种方法比较实用,记录如下: 第一种方法: 在运行窗口中输入CMD命令回车,进入命令行模式. 在此界面下输入:"fsutil file creatnew test.txt 1024"即可产生一个占用空间为1024字节,名为test.txt的文本. 命令中1024即为该文件占用空间大小,可以任意指定.比如输入1048576就可以产生一个1M大小的文件.当