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 相关文章推荐
innerHTML与jquery里的html()区别介绍
Oct 12 Javascript
JS基础随笔(菜鸟必看篇)
Jul 13 Javascript
简单理解js的prototype属性及使用
Dec 07 Javascript
完美解决node.js中使用https请求报CERT_UNTRUSTED的问题
Jan 08 Javascript
JS点击缩略图整屏居中放大图片效果
Jul 04 Javascript
Vue渲染函数详解
Sep 15 Javascript
基于javascript中的typeof和类型判断(详解)
Oct 27 Javascript
原生JS实现ajax与ajax的跨域请求实例
Dec 01 Javascript
详解Vue内部怎样处理props选项的多种写法
Nov 06 Javascript
element-ui 文件上传修改文件名的方法示例
Nov 05 Javascript
基于PHP pthreads实现多线程代码实例
Jun 24 Javascript
js+canvas实现转盘效果(两个版本)
Sep 13 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 图片上传实现代码 带详细注释
2010/04/29 PHP
Yii框架中 find findAll 查找出制定的字段的方法对比
2014/09/10 PHP
PHP实现通过中文字符比率来判断垃圾评论的方法
2014/10/20 PHP
PHP中addcslashes与stripcslashes函数用法分析
2016/01/07 PHP
php用户名的密码加密更安全的方法
2019/06/21 PHP
jQuery实现级联菜单效果(仿淘宝首页菜单动画)
2014/04/10 Javascript
AngularJS表单编辑提交功能实例
2015/02/13 Javascript
js实现仿阿里巴巴城市选择框效果实例
2015/06/24 Javascript
简单掌握JavaScript中const声明常量与变量的用法
2016/05/21 Javascript
jQuery绑定自定义事件的魔法升级版
2016/06/30 Javascript
浅析Node.js实现HTTP文件下载
2016/08/05 Javascript
AngularJS 应用身份认证的技巧总结
2016/11/07 Javascript
详解node+express+ejs+bootstrap构建项目
2017/09/27 Javascript
解决在Bootstrap模糊框中使用WebUploader的问题
2018/03/22 Javascript
微信小程序新手教程之页面打开数量限制
2019/03/03 Javascript
layui 根据后台数据动态创建下拉框并同时默认选中的实例
2019/09/02 Javascript
微信小程序实现吸顶特效
2020/01/08 Javascript
vue 项目软键盘回车触发搜索事件
2020/09/09 Javascript
Python实现抓取网页并且解析的实例
2014/09/20 Python
python简单实现操作Mysql数据库
2018/01/29 Python
Python实现的质因式分解算法示例
2018/05/03 Python
Python设计模式之外观模式实例详解
2019/01/17 Python
Windows 安装 Anaconda3+PyCharm的方法步骤
2019/06/13 Python
Python3网络爬虫开发实战之极验滑动验证码的识别
2019/08/02 Python
Python学习笔记之迭代器和生成器用法实例详解
2019/08/08 Python
Python 类方法和实例方法(@classmethod),静态方法(@staticmethod)原理与用法分析
2019/09/20 Python
解决Python图形界面中设置尺寸的问题
2020/03/05 Python
在python里使用await关键字来等另外一个协程的实例
2020/05/04 Python
欧迪办公美国官网:Office Depot
2016/08/22 全球购物
房地产推广策划方案
2014/05/19 职场文书
企业文化标语口号
2014/06/09 职场文书
贷款担保书
2015/01/20 职场文书
企业爱心捐款倡议书
2015/04/27 职场文书
民政局未婚证明
2015/06/15 职场文书
2015年秋季运动会前导词
2015/07/20 职场文书
Mac环境Nginx配置和访问本地静态资源的实现
2021/03/31 Servers