简述
日常开发中,经常有数值格式化的需求,其中,最常见的场景之一,就是千分位化。
本文从讲解两种实现方案,仅供参考!
常规方法
function getAddStr (str, num) {
var i, tmp = "";
for (i = 0; i< num; i++) {
tmp += str;
}
return tmp;
}
function commafy (num, index, separator, rententionNum) {
if (num === '--') {return '--';}
if (!index) {index = 3;}
if (!separator) {separator = ',';}
if (!rententionNum) {rententionNum = 2;}
num = num.toFixed(rententionNum);
var _this = this;
var reg = new RegExp('(-?[0-9]+)([0-9]{' + index + '})');
if (/^.*\..*$/.test(num)) {
var pointIndex = num.lastIndexOf('.');
var intPart = num.substring(0, pointIndex);
var pointPart = num.substring(pointIndex + 1, num.length);
var pointLen = pointPart.length;
if (pointLen >= 1) {pointPart = pointPart + getAddStr("0", rententionNum - pointLen);}
intPart = intPart + '';
while(reg.test(intPart)) {
intPart = intPart.replace(reg, '$1' + separator + '$2');
}
num = intPart + '.' + pointPart;
} else {
while (reg.test(num)) {
num = num.replace(reg, '$1' + separator + '$2');
}
num = num + '.' + _this.getAddStr("0", rententionNum);
}
return num;
}
console.log(commafy(123456, 3, ',', 0)); // 123,456.00
commafy方法接收四个参数 num、index、 separator、 rententionNum,num为待格式化的数值,index格式化字符出现的位置(千分位格式化,默认为3,表示每隔三位显示一个格式化字符),separator格式化字符(默认为“,”),rententionNum小数点个数(默认为2)。除了num,其他值都是可选的。
自定义模式实现
function numberFormat (number, fmt) {
var fmtSplit = fmt.split('.'),
number = Number(number),
numberString = '',
min,
max;
if (isNaN(number)) return number;
// 判断负数
if (number < 0) {
var isNegative = true;
}
// 如果有%号,做百分比转换
if (/\%/.test(fmt)) {
number *= 100;
}
// 小数部分
if (fmtSplit.length > 1) {
min = /0+/.exec(fmtSplit[1]);
max = /#+/.exec(fmtSplit[1]);
min = min == null ? 0 : min[0].length;
max = max == null ? 0 : max[0].length;
number = number.toFixed(max + min);
for(var i = 0; i< max; i++) {
if (number.slice(-1) !== '0') break;
number = number.slice(0, -1);
}
} else {
number = number.toFixed(0);
}
// 整数部分
var numberSplit = number.replace('-', '').split('.');
min = /[0]+/.exec(fmtSplit[0].replace(',',''));
min = min == null ? 0 : min[0].length;
while(numberSplit[0].length < min ) {
numberSplit[0] = '0' + numberSplit[0];
}
// 加千分位
if (fmtSplit[0].lastIndexOf(',') !== -1) {
var groupby = fmtSplit[0].slice(fmtSplit[0].lastIndexOf(','));
groupby = /[0#]+/.exec(groupby);
if (groupby != null) {
var reg = new RegExp('(-?[0-9]+)([0-9]{' + groupby[0].length + '})');
while (reg.test(numberSplit[0])){
numberSplit[0] = numberSplit[0].replace(reg, '$1,$2');
}
}
}
numberString = (isNegative ? '-' : '') + (numberSplit.length > 1 ? numberSplit.join('.') : numberSplit[0]);
return fmt.replace(/[0#\-\,\.]+/, numberString);
}
console.log(numberFormat(123456, '#,##0.00')); // 123,456.00
如上代码,numberFormat接收两个参数,num跟fmt,num为待格式化的数值,fmt为格式化模式字符串,包含#跟0两个字符。
'#,##0.00' 表示 小数点后是“00”,个位是‘0’,十位是‘#’,百位是‘#’,千位是‘#’。
其中,“#”表示待格式化的数值,在该位上,没有值,则不显示该位。又或者待格式化数值该位为0且为最高位上的数值,也不显示该值。举例:如果用'#,##0'格式化1000,结果为1,000;同样的,格式化010,则结果是10(010百位的0不显示)。
‘0’表示待格式化的数字,在该位上,如果值则用0表示。'#,##0.00'格式化100时,结果是100.00。