javascript实现将数字转成千分位的方法小结【5种方式】


Posted in Javascript onDecember 11, 2016

本文实例讲述了javascript实现将数字转成千分位的方法。分享给大家供大家参考,具体如下:

javascript实现将数字转成千分位的方法小结【5种方式】

尽管离过年还有两个月之久,春运抢票的战斗已经打响了,悲剧的是我还没抢到票,看到某浏览器上的数字时,想到一个经典面试题,没错,就是数字转千分位。如将数字87463297转成87,463,297,方法有很多种,我这里只想到5种。

1、利用正则的零宽度正预测先行断言(?=exp),名字有点难记,意思是它断言自身出现的位置的后面能匹配表达式exp,对此概念还不明白的可以戳这里,这里不做过多解释。数字千分位的特点是,第一个逗号后面数字的个数是3的倍数,正则:/(\d{3})+$/;第一个逗号前最多可以有1至3个数字,正则:/\d{1,3}/。加起来就是/\d{1,3}(\d{3})+$/,分隔符要从前往后加,就要将前面的数字“87”替换成“87,”,为什么是87不是874?因为874后面只剩下5位数字,在632后加一个分隔符后,将只剩下97,不符合千分位要求,所以第一个分隔符后面的数字位数必须是3的倍数。要匹配数字87,又要保证87后面数字位数是3的倍数,并且要将匹配的87替换成“87,”,就要用到(?=exp),这里先定义一个变量var str = "87463297";

// 零宽断言
console.info( str.replace(/\d{1,3}(?=(\d{3})+$)/g,function(s){
  return s+','
}) )

2、利用正则的子项来替换,跟第1种方法类似。

// 子项
console.info( str.replace(/(\d{1,3})(?=(\d{3})+$)/g,function($1){
  return $1=$1+','
}) )

3、先将字符串转成数组,利用reverse反转数组后每3个数字后添加一个分隔符“,”,到字符串末尾除外,之后转回字符串。

// 利用字符串和数组方法
console.info( str.split("").reverse().join("").replace(/(\d{3})+?/g,function(s){
  return s+",";
}).replace(/,$/,"").split("").reverse().join("") )

4、利用while循环拼接字符串每隔3个数字加一个分隔符,首尾不加

// 利用循环拼接字符串每隔3个加一个分隔符
var result="",
  index = 0,
  len = str.length-1;
while(len>=0) {
  index%3===0&&index!==0 ? result+=","+str[len] : result+=str[len];
  len--;
  index++;
};
result=result.split("").reverse().join("");
console.info(result);

5、利用while循环在数组里push分隔符,首尾不加

// 利用while循环在数组里push分隔符
var result="",
  index = 0,
  len = str.length,
  i = len-1,
  arr = str.split("");
while(len-index>0){
  len>=index&&len-index!==len && arr.splice(len-index,0,",");
  index+=3;
  i-=4;
};
console.log(arr.join(""));

结语:第1种方法是最简洁的,性能也是最好的,推荐使用。顺便附上所有例子的demo源码下载,如果还有其它更好更方便的方法请告诉我,谢谢!

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

Javascript 相关文章推荐
De facto standard 世界上不可思议的事实标准
Aug 29 Javascript
js bind 函数 使用闭包保存执行上下文
Dec 26 Javascript
关于Javascript与iframe的那些事儿
Jul 04 Javascript
原生js实现返回顶部缓冲效果
Jan 18 Javascript
微信小程序开发之好友列表字母列表跳转对应位置
Sep 26 Javascript
基于 flexible 的 Vue 组件:Toast -- 显示框效果
Dec 26 Javascript
vue的全局提示框组件实例代码
Feb 26 Javascript
关于js对textarea换行符的处理方法浅析
Aug 03 Javascript
详解vue-router传参的两种方式
Sep 10 Javascript
JavaScript显式数据类型转换详解
Mar 18 Javascript
js计算两个时间差 天 时 分 秒 毫秒的代码
May 21 Javascript
关于layui时间回显问题的解决方法
Sep 24 Javascript
JavaScript获取服务器时间的方法详解
Dec 11 #Javascript
基于jQuery实现的查看全文功能【实用】
Dec 11 #Javascript
AngularJS过滤器filter用法分析
Dec 11 #Javascript
jquery判断页面网址是否有效的两种方法
Dec 11 #Javascript
JavaScript奇技淫巧44招【实用】
Dec 11 #Javascript
利用JS判断鼠标移入元素的方向
Dec 11 #Javascript
实现JavaScript高性能的数据存储
Dec 11 #Javascript
You might like
浅析PHP中strlen和mb_strlen的区别
2014/08/31 PHP
CodeIgniter多语言实现方法详解
2016/01/20 PHP
利用PHP抓取百度阅读的方法示例
2016/12/18 PHP
PHP获取日期对应星期、一周日期、星期开始与结束日期的方法
2018/06/22 PHP
Laravel 验证码认证学习记录小结
2019/12/20 PHP
javascript 图片上一张下一张链接效果代码
2010/03/12 Javascript
jquery validation验证身份证号,护照,电话号码,email(实例代码)
2013/11/06 Javascript
Javascript中设置默认参数值示例
2014/09/11 Javascript
jQuery使用after()方法在元素后面添加多项内容的方法
2015/03/26 Javascript
JQuery遍历元素的父辈和祖先的方法
2016/09/18 Javascript
Node.js实现连接mysql数据库功能示例
2017/09/15 Javascript
用JavaScript做简易的购物车的代码示例
2017/10/20 Javascript
在vue项目创建的后初始化首次使用stylus安装方法分享
2018/01/25 Javascript
vue-cli3.0使用及部分配置详解
2018/08/29 Javascript
vue中实现弹出层动画效果的示例代码
2020/09/25 Javascript
[01:46]DOTA2上海特锦赛小组赛英文解说KotlGuy采访
2016/02/27 DOTA
python文件与目录操作实例详解
2016/02/22 Python
Pandas 数据处理,数据清洗详解
2018/07/10 Python
flask框架视图函数用法示例
2018/07/19 Python
Python退火算法在高次方程的应用
2018/07/26 Python
Scrapy 配置动态代理IP的实现
2020/09/28 Python
Python中random模块常用方法的使用教程
2020/10/04 Python
北美领先的牛仔品牌:Buffalo David Bitton
2017/05/22 全球购物
eDreams加拿大:廉价航班、酒店和度假
2019/03/29 全球购物
介绍一下SQL Server里面的索引视图
2016/07/31 面试题
社区党员先进事迹
2014/01/22 职场文书
2014庆六一活动方案
2014/03/02 职场文书
大学生应聘导游自荐信
2014/06/02 职场文书
农民工讨薪标语
2014/06/26 职场文书
党支部对照检查材料
2014/08/25 职场文书
2014年度工作总结报告
2014/12/15 职场文书
关于职业道德的心得体会
2016/01/18 职场文书
浅析Python中的随机采样和概率分布
2021/12/06 Python
【海涛七七解说】DCG第二周:DK VS 天禄
2022/04/01 DOTA
nginx容器方式反向代理实战
2022/04/18 Servers
使用Redis实现分布式锁的方法
2022/06/16 Redis