我是靠谱客的博主 仁爱狗,最近开发中收集的这篇文章主要介绍js金额千分位显示_JS数字千分位格式化实现方法总结,觉得挺不错的,现在分享给大家,希望可以做个参考。

概述

本文实例讲述了JS数字千分位格式化实现方法。分享给大家供大家参考,具体如下:

用js实现如下功能,将给定的数字转化成千分位的格式,如把“10000”转化成“10,000”,并考虑到性能方面的因素。

一.首先想到的办法,将数字转换为字符串(toString())再打散成数组(split),如果直接数字转换为数组,就是一整个放进去了,不能单独取到每一位。然后通过循环,逐个倒着把数组中的元素插入到新数组的开头(unshift),第三次或三的倍数次,插入逗号,最后把新数组拼接成一个字符串

n=1233456;

toQfw(n);

function toQfw(){

var arr_n=n.toString().split("");

var result=[];

var cs=0;

for(var i=arr_n.length-1;i>=0;i--){

cs++;

result.unshift(arr_n[i]);

if(!(cs%3)&&i!=0){ //i!=0即取到第1位的时候,前面不用加逗号

result.unshift(",");

}

alert(result.join(""))

}

};

缺点,一位一位的加进去,性能差,且还要先转换成字符串再转换成数组

二.于是想到能不能从头到尾都用字符串完成,不通过数组,即用charAt()获取子字符串,主要用到字符串拼接

n=1233456;

toQfw(n);

function toQfw(){

var str_n=n.toString();

var result="";

var cs=0;

for(var i=str_n.length-1;i>=0;i--){

cs++;

result=str_n.charAt(i)+result;

if(!(cs%3)&&i!=0){

result=","+result;

}

alert(result)

}

};

缺点:依然是一位一位加进去

三.可不可以不用循环用纯字符串方法来实现,这样就不会一位一位加进去了。每次取末三位子字符串放到一个新的空字符串里并拼接上之前的末三位,原本数组不断截掉后三位直到长度小于三个,最后把剥完的原数组拼接上新的不断被填充的数组

n=1233456;

toQfw(n);

function toQfw(){

var str_n=n.toString();

var result="";

while(str_n.length>3){

result=","+str_n.slice(-3)+result;

str_n=str_n.slice(0,str_n.length-3)

}

if(str_n){

alert(str_n+result)

}

};

性能最佳

四.用正则表达式,去最后三位数字,和字符串匹配,匹配成功就把后三位存起来,前面加逗号,然后将原字符串的值更新为匹配成功剩下的左边,直到正则与字符串匹配成功后三位的值和原字符串更新值相等时,说明取完了

n=1233456;

toQfw(n);

function toQfw(){

var str_n=n.toString();

var result="";

var re=/d{3}$/;

while(re.test(str_n)){

result=RegExp.lastMatch+result;

if(str_n!=RegExp.lastMatch){

result=","+result;

str_n=RegExp.leftContext; //匹配成功,返回匹配内容左侧的字符信息

}

else{

num="";

}

}

if(str_n){

alert(str_n+result);

}

}

五.简化版正则,用前向声明和非前向声明,从后往前匹配3位数字,前向声明的地方替换成逗号,但是如果刚好3的倍数位,会第一位前面也加,所以前面要再来个非前向声明

var str="123598752";

var re=/(?=(?!(b))(d{3})+$)/g;

str=str.replace(re,",");

alert(str);

希望本文所述对大家JavaScript程序设计有所帮助。

最后

以上就是仁爱狗为你收集整理的js金额千分位显示_JS数字千分位格式化实现方法总结的全部内容,希望文章能够帮你解决js金额千分位显示_JS数字千分位格式化实现方法总结所遇到的程序开发问题。

如果觉得靠谱客网站的内容还不错,欢迎将靠谱客网站推荐给程序员好友。

本图文内容来源于网友提供,作为学习参考使用,或来自网络收集整理,版权属于原作者所有。
点赞(49)

评论列表共有 0 条评论

立即
投稿
返回
顶部