最近被同事问到js如何实现给长数字添加千位分隔符,即 1344444 ---> 13,444,444 这是一个很常见的前端面试题。看起来简单,刚开始我都懒得写。

仔细一想,挺考逻辑的,实现方法有很多种,可以用三位循环、字符串数组分隔,也可以使用正则。刚开自己用js实现了堆栈,代码太多,不够优雅,同时也暴露了自己原生js的生疏,事后也看到了同事们各样的实现方法,无非都是循环和字符串分隔,于是决心使用更优雅的正则装逼一下。

仔细思考:

输入:数字(考虑数字是否合法、正负号、小数点)、字符串

输出:考虑到使用场景,最好是字符串

测试用例:-1234567.9012

期待输出:-1,234,567.9012

千位分隔符貌似在《精通正则表达式》中讲环视的时候作为经典范例,然而写出来发现js不支持逆序环视,也就是 (?<=expression) (?<!expression) 这两种是不支持的。

再三考虑和尝试之后得出以下代码,只需一行!完美实现!

// 正则
function thousandBitSeparator(num) {
return num && num
.toString()
.replace(/(\d)(?=(\d{3})+\.)/g, function($0, $1) {
return $1 + ",";
});
}
console.log(thousandBitSeparator(-1234567.9012));
// -1,234,567.9012

todo

--- update 2015年07月03日 ---

经朋友提醒,当测试用例是1000的时候,此正则不能正确标注千位分隔符,现修改如下:


function thousandBitSeparator(num) {
return num && (num
.toString().indexOf('.') != -1 ? num.toString().replace(/(\d)(?=(\d{3})+\.)/g, function($0, $1) {
return $1 + ",";
}) : num.toString().replace(/(\d)(?=(\d{3}))/g, function($0, $1) {
return $1 + ",";
}));
}
console.log(thousandBitSeparator(1000));
//1,000

千位分隔符(js 实现)的更多相关文章

  1. js千位符 | js 千位分隔符 | js 金额格式化

    js 千位分隔符 千位分隔符,其实就是数字中的逗号.依西方的习惯,人们在数字中加进一个符号,以免因数字位数太多而难以看出它的值.所以人们在数字中,每隔三位数加进一个逗号,也就是千位分隔符,以便更加容易 ...

  2. JS给数字加千位分隔符

    本文原链接:https://www.jianshu.com/p/928c68f92c0c JavaScript实现千位分隔符 将普通的数字转换为带千位分隔符格式的数字字符串是一个非常常见的问题,千位分 ...

  3. 使用千位分隔符(逗号)表示web网页中的大数字

    做手机端页面我们常常遇到数字,而在Safari浏览器下这些数字会默认显示电话号码,于是我们就用到了补坑的方法加入<meta>标签: <meta name="format-d ...

  4. golang 千位分隔符

    项目需求将统计出的数字以千位分隔符分隔的形式展示(如将 1234567.89 格式化为 1,234,567.89),而 golang 的标准库中并无这样的函数. 万能的 google 找到解决办法,可 ...

  5. 千位分隔符在web开发中的作用

    有千位分隔符会被认为是数字,否则在移动端会被直接识别成手机号 在开发实战中主流实现方式是添加meta标签 <meta name="format-detection" cont ...

  6. 千位分隔符的JS实现

    $.extend({ //千位分割符 MoneySeparator: function numFormat(num){ if(num==null){ return num; }else { num=n ...

  7. JS 实现四舍五入保留两位小数并且添加千位分隔符

    var a = "-123456789.078";a = (Math.round(a * 100) / 100).toFixed(2).toString().replace(/(\ ...

  8. js实现千位分隔符——str.replace()用法

    /*js*/function commafy(num){ return num && num.toString().replace(/(\d{1,3})(?=(\d{3})+(?:$| ...

  9. js ---- 实现千位分隔符

    第一种方法: var num = 1234567; var string = num.toString(); var arr = string.split('').reverse(); console ...

随机推荐

  1. APP One Link ,android and ios qrcode merge as One QRCode and one short link

    Adroid and ios qrcode merge as One QRCode and one short link is publish , the web site is www.appone ...

  2. js获取url

    location.href 返回完整的url location.origin  返回带协议的主机域名  如http://www.test.com location.pathname  返回url中路径 ...

  3. 文件与目录的rwx权限

    r(Read,读取):对文件而言,具有读取文件内容的权限:对目录来说,具有浏览目录的权限. w(Write,写入):对文件而言,具有新增.修改文件内容的权限:对目录来说,具有删除.移动目录内文件的权限 ...

  4. 开始对函数式编程 产生了尊崇感,因为Spring4.x ,Grooxy,Lisp,网易出来伞哥和他的博客

    1  无意看到"丢弃重口味的xml配置--spring4用groovy配置bean",这篇文章,里面说到spring4开始可以使用Groovy进行配置,可以取代xml方式和注解方式 ...

  5. 使用T-SQL进行活动目录查询

    最近在某个项目中,需要针对TFS的用户按照所属的AD组来进行数据分析,但发现TFS中并没有存储用户所属的组信息,故考虑直接从AD中提取这个信息并存放在SQL Server的数据库表里面去. 经过一番G ...

  6. 揣摩实现一个ioc容器需要做的事情

    思路: ioc框架的核心就是管理bean的生命周期,bean的生命周期包括:创建,使用,销毁. 创建 容器在创建一个bean的实例之前必须要解决以下问题:第一个问题: 创建bean的信息如何提供给你容 ...

  7. 如何分析解读systemstat dump产生的trc文件

    ORACLE数据库的systemstat dump生成trace文件虽然比较简单,但是怎么从trace文件中浩如烟海的信息中提炼有用信息,并作出分析诊断是一件技术活,下面收集.整理如何分析解读syst ...

  8. Java Se :Map 系列

    之前对Java Se中的线性表作了简单的说明.这一篇就来看看Map. Map系列的类,并不是说所有的类都继承了Map接口,而是说他们的元素都是以<Key, Value>形式设计的. Dic ...

  9. Linux服务器文件删除空间未释放的问题

    一.问题起源 在Linux系统中,通过rm删除文件将会从文件系统的目录结构上解除链接(unlink),如果文件是被打开的(有一个进程正在使用),那么进程将仍然可以读取该文件磁盘空间也一直被占用 这样就 ...

  10. python中mysqldb的用法

    1.引入MySQLdb库 import MySQLdb 2.和数据库建立连接 conn=MySQLdb.connect(host="localhost",user="ro ...