当前位置:首页 > 知识分享 > 正文内容

今日知识分享js分割函数

2年前 (2023-05-27)知识分享93

在项目开发中需要js实现千位分隔符来分割一个整数,比如我想将数字 1234567 显示为“1,234,567”。我该怎么实现呢?

方法一、利用循环

实现思路是将数字转换为字符数组,再循环整个数组, 每三位添加一个分隔逗号,最后再合并成字符串。

function numberWithCommas(x) {

    x = x.toString();

    var pattern = /(-?\d+)(\d{3})/;

    while (pattern.test(x))

        x = x.replace(pattern, "$1,$2");

    return x;

}

numberWithCommas(12312124545);//'12,312,124,545'

numberWithCommas(123121245.45);//'123,121,245.45'

方法二、toLocaleString

Number.prototype.toLocaleString。它是在 JavaScript 1.5(于 1999 年推出)中实现的,因此基本上所有主要浏览器都支持它。

var num = 12345.1234

num.toLocaleString();//'12,345.123'

注意的是这个函数在没有指定区域的基本使用时,返回使用默认的语言环境和默认选项格式化的字符串,所以不同地区数字格式可能会有一定的差异。最好确保使用 locales 参数指定了使用的语言。

注:我测试的环境下小数部分会根据四舍五入只留下三位。比如:

var b=1234.4542;

b.toLocaleString();//'1,234.454'

方法三、正则表达式和replace函数

使用正则表达式和replace函数,相对前两种我更喜欢这种方法,虽然正则有点难以理解。

function numberWithCommas(x) {

    return x.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");

}

正则表达式使用 2 个前瞻断言:

  • 一个正数,用于在字符串中查找其后连续 3 位数字的任何点,
  • 一个否定断言,以确保该点只有 3 位数字的倍数。替换表达式在那里放置一个逗号。

注意:这个函数如果小数点后有超过3位数字的话,会在不需要的地方添加逗号。如果这是一个问题,您可以使用此功能。

function numberWithCommas(x) {

    var parts = x.toString().split(".");

    parts[0] = parts[0].replace(/\B(?=(\d{3})+(?!\d))/g, ",");

    return parts.join(".");

}

更简洁,最终代码:

function numberWithCommas(x) {

    return x.toString().replace(/\B(?<!\.\d*)(?=(\d{3})+(?!\d))/g, ",");

}

方法四:Intl.NumberFormat

原生js功能。支持 IE11、Edge、最新的 Safari、Chrome、Firefox、Opera、iOS 上的 Safari 和 Android 上的 Chrome。

可以把普通的数字,转换成不同的货币和格式样式字符串。

let number = 1234567890;

let nf = new Intl.NumberFormat('en-US');

nf.format(number); // "1,234,567,890"

更多实例:


var number = 123456.789;

console.log(new Intl.NumberFormat('de-DE', { style: 'currency', currency: 'EUR' }).format(number));
// expected output: "123.456,79 €"

// the Japanese yen doesn't use a minor unit
console.log(new Intl.NumberFormat('ja-JP', { style: 'currency', currency: 'JPY' }).format(number));
// expected output: "¥123,457"

// limit to three significant digits
console.log(new Intl.NumberFormat('en-IN', { maximumSignificantDigits: 3 }).format(number));

// expected output: "1,23,000"

扫描二维码推送至手机访问。

版权声明:本文由阿龙玩站网发布,如需转载请注明出处。

本文链接:https://www.longge2021.cn/zhideyikan/26314.html

分享给朋友:

“今日知识分享js分割函数” 的相关文章

手机照片怎么添加文字(手机怎样在图片上编辑文字)

手机照片怎么添加文字(手机怎样在图片上编辑文字)

如何给你的照片添加喜欢的文字,让照片变得更好看?赶快看过来,你可能会说用微信就可以,下面给你分享一种方法,效果会更好,操作还简单,更好的是还可以拼长图,赶快点赞关注收藏转发一下,和 如何给你的照片添加喜欢的文字,让照片变得更好看?赶快看过来,你可能会说用微信就可以,下面给你分享一种方法,效果会更好...

抖音排名前十网红(2022最火的网红是谁)

抖音排名前十网红(2022最火的网红是谁)

“抖音第一网红”又换人了。3月底,“疯狂小杨哥”终于超过“刘德华”,成为粉丝量Top1的抖音网红。截至目前,疯狂小杨哥的抖音粉丝量达7242万。(统计不包括“人民日报”“央视新闻” “抖音第一网红”又换人了。 3月底,“疯狂小杨哥”终于超过“刘德华”,成为粉丝量Top1的抖音网红。截至目前,疯狂...

seo优化排名推广的方法有哪些(介绍seo优化排名推广的4种方法)

seo优化排名推广的方法有哪些(介绍seo优化排名推广的4种方法)

网站新手入行时,在接手一个网站项目的时候往往不知道怎么入手,可能大多数优化人员都会首先想到挖掘关键词,采集文章伪原创,布局外链等等一些SEO职能范畴之内的具体事务,这些仅仅属于在S 网站新手入行时,在接手一个网站项目的时候往往不知道怎么入手,可能大多数优化人员都会首先想到挖掘关键词,采集文章伪原创...

怎么做广告策划(宣传策划方案怎么做)

怎么做广告策划(宣传策划方案怎么做)

广告主收到的广告策划信息材料多种多样,内容十分丰富,因此广告主收到的信息量相当大而复杂。广告策划案的一些写作技巧也涉及到如何以一种易于理解的方式表达这些信息,并使其在内容和形式上更 广告主收到的广告策划信息材料多种多样,内容十分丰富,因此广告主收到的信息量相当大而复杂。广告策划案的一些写作技巧也涉...

马云近几天出什么事了新闻(马云移民的真实原因)

马云近几天出什么事了新闻(马云移民的真实原因)

对于大佬们的一举一动,一直以来都备受热议,如今马云和刘强东等人的套现离场,更是让很多人议论不已,他们为什么要套现选择移居国外生活呢?对于这种现象,网友们也是众说纷纭,大家看待这件事的角度还是不同的。有人认为,不管是多么正 对于大佬们的一举一动,一直以来都备受热议,如今马云和刘强东等人的套现离场...

360安全浏览器兼容模式怎么设置在哪里(360浏览器兼容模式设置不了)

360安全浏览器兼容模式怎么设置在哪里(360浏览器兼容模式设置不了)

在使用浏览器的过程中,可能会遇到需要切换至兼容模式才能打开想要页面的情况。现在很多浏览器都自带防毒功能,可能会把很多元件直接当成病毒自动阻挡,导致一些元素在普通模式下无法显示。本文将根据大家常用的浏览器提供相应的浏览器兼 在使用浏览器的过程中,可能会遇到需要切换至兼容模式才能打开想要页面的情况。现...

板栗可以用微波炉加热吗(板栗用微波炉加热会不会爆炸)

板栗可以用微波炉加热吗(板栗用微波炉加热会不会爆炸)

板栗是秋季比较常见的一种美食,它的吃法比较多,吃起来软糯可口,营养价值高,深受人们喜欢。板栗一般要吃热的,这样比较容易消化吸收,冷掉的熟板栗可以放微波炉加热,一般只要是开口的板栗,短时间加热是不会爆炸的。板栗可以微波炉加 板栗是秋季比较常见的一种美食,它的吃法比较多,吃起来软糯可口,营养价值高,深...

深圳市十大著名旅游景点?(深圳南山好玩的地方)

深圳市十大著名旅游景点?(深圳南山好玩的地方)

深圳南山好玩的地方 1 欢乐海岸 景区简介: 快乐海岸总面积约125万平方米,其中水域面积近一半。总的来说,快乐海岸最大的特点就是以水为魂。 深圳市十大著名旅游景点? 景区亮点: 快乐海岸汇聚全球大师智慧,以海洋文化为主题,以生态环境保护为理念,以创新商业为主体,以创造城市滨海健...

南通市海门市十大著名旅游景点?(海门旅游景点大全)

南通市海门市十大著名旅游景点?(海门旅游景点大全)

海门旅游景点大全 近年来,朝阳区积极引导沿海休闲度假旅游、农业生态旅游、名胜古迹文化旅游等特色旅游项目的发展,不断完善景区设施,特别是以国家特色城镇海门镇为核心,以莲花峰景区建设为重点,继续挖掘和整合旅游资源,打造朝阳旅游品牌,进一步加强宣传推广,提高朝阳旅游的知名度和影响力。 南...

蒸馒头要用多长时间?(蒸馒头三层哪一层先熟)

蒸馒头要用多长时间?(蒸馒头三层哪一层先熟)

蒸馒头三层哪一层先熟 头蒸过程主要是物理变化。在加热馒头的过程中,面团内部的气泡也会受热膨胀。高温水蒸气通过多层蒸笼上升。当遇到冷蒸笼时,大量水蒸气液化并释放大量热量。从表面上看,上层蒸笼的馒头是先煮的。实际上,蒸笼层数太多,蒸馒头的师傅会把上层换到下层。这种倒笼的过程,即蒸到一半的时间...

薯片里面的气体是什么气体(薯片吃多了对身体有什么危害)

薯片里面的气体是什么气体(薯片吃多了对身体有什么危害)

薯片里面的气体是氮气,这种是健康无害的,没有气味,可以放心食用,不需要担心哦!那么,薯片吃多了对身体有什么危害?一起来看看久久派带来的详细介绍吧!薯片里面的气体是什么气体芯片中的气体是氮气。氮清洁、无毒、干燥。可以防止 薯片里面的气体是氮气,这种是健康无害的,没有气味,可以放心食用,不需要担心哦!...

窦性心律不齐是心脏病早期吗(窦性心律不齐需要治疗吗)

窦性心律不齐是心脏病早期吗(窦性心律不齐需要治疗吗)

窦性心律不齐是心脏的一种反射图,一般在进行心电图检查时,很多年轻人都会检查出窦性心律不齐。那么,窦性心律不齐是心脏病早期吗?窦性心律不齐需要治疗吗?一起来看看久久派带来的详细介绍吧!窦性心律不齐是心脏病早期吗窦性心律不齐 窦性心律不齐是心脏的一种反射图,一般在进行心电图检查时,很多年轻人都会检查出...

电瓶车放地铁口容易丢吗(每天骑电动车去地铁站靠谱吗)

电瓶车放地铁口容易丢吗(每天骑电动车去地铁站靠谱吗)

电瓶车放地铁口如果不过夜的话就还好,如果放一晚上如果被小偷偷,大白天的小偷自然不会偷电瓶,会不方便下手,等天黑人少的时候,就开始下手了,所以上下班骑电瓶车是可以的,但是不要在地铁口留宿哦!电瓶车放地铁口容易丢吗每辆电瓶车 电瓶车放地铁口如果不过夜的话就还好,如果放一晚上如果被小偷偷,大白天的小偷自...

燕麦保存方法和注意事项(怎么储存麦片)

燕麦保存方法和注意事项(怎么储存麦片)

燕麦保存方法和注意事项,怎么储存麦片。小编带你了解更多相关信息。 1、燕麦的储存方法,选购杂粮燕麦片时,尽量选择单独包装的小包,不要买大包装的。如果买的是大袋,每次吃完记得要用夹子夹紧袋口;或者买有真空密封锁扣的袋装。 2、麦片不要放在潮湿的地方,最好放在可以密封的袋子或者罐子里;更不要放置...

聊天中aq是什么意思(聊天中aq的含义)

聊天中aq是什么意思(聊天中aq的含义)

聊天中aq是什么意思,聊天中aq的含义。小编带你了解更多相关信息。 1、聊天中aq是一个网络流行词,指的是我们在面对逆境时的处理能力,明确地描绘出一个人的挫折忍受力,是AdversityQuotient的简写,一般被译为挫折商或逆境商。 2、AQ是除了智商、情商外,近年来又流行一个新概念:...