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 相关文章推荐
ExtJS的FieldSet的column列布局
Nov 20 Javascript
常用一些Javascript判断函数
Aug 14 Javascript
js控制CSS样式属性语法对照表
Dec 11 Javascript
js调用iframe实现打印页面内容的方法
Mar 04 Javascript
jQuery+css3实现Ajax点击后动态删除功能的方法
Aug 10 Javascript
JavaScript实现给定时间相加天数的方法
Jan 25 Javascript
jQuery实现手机自定义弹出输入框
Jun 13 Javascript
jQuery和JavaScript节点插入元素的方法对比
Nov 18 Javascript
js中数组插入、删除元素操作的方法
Feb 15 Javascript
JS实现给json数组动态赋值的方法示例
Mar 19 Javascript
如何在Vue.js中实现标签页组件详解
Jan 02 Javascript
利用weixin-java-miniapp生成小程序码并直接返回图片文件流的方法
Mar 29 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中根据某年第几天计算出日期年月日的代码
2011/02/24 PHP
PHP创建多级目录的两种方法
2016/10/28 PHP
Ubuntu中支持PHP5与PHP7双版本的简单实现
2018/08/19 PHP
PHP htmlspecialchars_decode()函数用法讲解
2019/03/01 PHP
解决 FireFox 下[使用event很麻烦] 的问题.
2006/08/22 Javascript
JQuery.ajax传递中文参数的解决方法 推荐
2011/03/28 Javascript
javascript模拟php函数in_array
2015/04/27 Javascript
jquery实现可点击伸缩与展开的菜单效果代码
2015/08/31 Javascript
window.onerror()的用法与实例分析
2016/01/27 Javascript
JavaScript数据结构与算法之集合(Set)
2016/01/29 Javascript
自己封装的一个原生JS拖动方法(推荐)
2016/11/22 Javascript
解决Nodejs全局安装模块后找不到命令的问题
2018/05/15 NodeJs
vue+web端仿微信网页版聊天室功能
2019/04/30 Javascript
解决mui框架中switch开关通过js控制开或者关状态时小圆点不动的问题
2019/09/03 Javascript
深入理解redux之compose的具体应用
2020/01/12 Javascript
JavaScript console的使用方法实例分析
2020/04/28 Javascript
js实现mp3录音通过websocket实时传送+简易波形图效果
2020/06/12 Javascript
解决VUE项目使用Element-ui 下拉组件的验证失效问题
2020/11/07 Javascript
前端 javascript 实现文件下载的示例
2020/11/24 Javascript
Python探索之创建二叉树
2017/10/25 Python
python 定时修改数据库的示例代码
2018/04/08 Python
Python中的 is 和 == 以及字符串驻留机制详解
2019/06/28 Python
pycharm新建一个python工程步骤
2019/07/16 Python
python dataframe NaN处理方式
2019/12/26 Python
Python Django搭建网站流程图解
2020/06/13 Python
python 基于卡方值分箱算法的实现示例
2020/07/17 Python
美国厨房和园艺工具网上商店:Nestneed
2019/08/24 全球购物
Servlet的生命周期
2013/08/25 面试题
活动宣传策划方案
2014/05/23 职场文书
年终晚会活动方案
2014/08/21 职场文书
法定代表人资格证明书
2014/09/11 职场文书
2015年银行个人工作总结
2015/05/14 职场文书
国家助学金受助感言
2015/08/01 职场文书
关于销售人员的年终工作总结要点
2019/08/15 职场文书
聊一聊Redis与MySQL双写一致性如何保证
2021/06/26 Redis
SQL注入篇学习之盲注/宽字节注入
2022/03/03 MySQL