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 相关文章推荐
url地址自动加#号问题说明
Aug 21 Javascript
jquery的index方法实现tab效果
Feb 16 Javascript
jQuery中nextAll()方法用法实例
Jan 07 Javascript
javascript控制层显示或隐藏的方法
Jul 22 Javascript
基于javascript html5实现3D翻书特效
Mar 14 Javascript
使用jquery.qrcode.js生成二维码插件
Oct 17 Javascript
JavaScript实现简易的天数计算器实例【附demo源码下载】
Jan 18 Javascript
Vue2.0 从零开始_环境搭建操作步骤
Jun 14 Javascript
javascript实现对话框功能警告(alert 消息对话框)确认(confirm 消息对话框)
May 07 Javascript
原生js实现的观察者和订阅者模式简单示例
Apr 18 Javascript
基于Vue中的父子传值问题解决
Jul 27 Javascript
vue.js 使用原生js实现轮播图
Apr 26 Vue.js
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
ThinkPHP实现带验证码的文件上传功能实例
2014/11/01 PHP
自己写的php中文截取函数mb_strlen和mb_substr
2015/02/09 PHP
thinkphp框架实现数据添加和显示功能
2016/06/29 PHP
PHP序列化和反序列化深度剖析实例讲解
2020/12/29 PHP
免费空间广告万能消除代码
2006/09/04 Javascript
Array, Array Constructor, for in loop, typeof, instanceOf
2011/09/13 Javascript
JavaScript中this的使用详解
2013/11/08 Javascript
在JavaScript中处理时间之getHours()方法的使用
2015/06/10 Javascript
原生js实现秒表计时器功能
2017/02/16 Javascript
Bootstrap警告框(Alert)插件使用方法
2017/03/21 Javascript
jQuery Ajax使用FormData上传文件和其他数据后端web.py获取
2017/06/11 jQuery
在小程序中使用Echart图表的示例代码
2018/08/02 Javascript
vue项目部署到Apache服务器中遇到的问题解决
2018/08/24 Javascript
jquery的$().each和$.each的区别
2019/01/18 jQuery
Nodejs实现的操作MongoDB数据库功能完整示例
2019/02/02 NodeJs
react项目如何使用iconfont的方法步骤
2019/03/13 Javascript
基于vue+uniapp直播项目实现uni-app仿抖音/陌陌直播室功能
2019/11/12 Javascript
如何利用 JS 脚本实现网页全自动秒杀抢购功能
2020/10/12 Javascript
Python在Windows和在Linux下调用动态链接库的教程
2015/08/18 Python
详解Python在七牛云平台的应用(一)
2017/12/05 Python
对django xadmin自定义菜单的实例详解
2019/01/03 Python
Python 读取用户指令和格式化打印实现解析
2019/09/02 Python
Python逐行读取文件内容的方法总结
2020/02/14 Python
python实现在列表中查找某个元素的下标示例
2020/11/16 Python
Python中全局变量和局部变量的理解与区别
2021/02/07 Python
html5 Canvas画图教程(5)—canvas里画曲线之arc方法
2013/01/09 HTML / CSS
HTML5+CSS3模仿优酷视频截图功能示例
2017/01/05 HTML / CSS
我爱我的祖国演讲稿
2014/05/04 职场文书
市场营销专业自荐书
2014/06/10 职场文书
县委常委班子对照检查材料思想汇报
2014/09/28 职场文书
副总经理岗位职责范本
2014/09/30 职场文书
党支部反对四风思想汇报
2014/10/10 职场文书
新教师教学工作总结
2015/08/12 职场文书
全民创业工作总结
2015/08/13 职场文书
MSSQL基本语法操作
2022/04/11 SQL Server
Python面试不修改数组找出重复的数字
2022/05/20 Python