1. 爱玩数码首页
  2. 电脑平板

js数组转字符串逗号拼接(4种JavaScript实现千位分隔符的方法)

4种JavaScript实现千位分隔符的方法

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

方法一、利用循环

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

functionnumberWithCommas(x) { x = x.toString(); varpattern = /(-?d+)(d{3})/; while(pattern.test(x)) x = x.replace(pattern, “$1,$2”); returnx; } numberWithCommas(12312124545);//’12,312,124,545’numberWithCommas(123121245.45);//’123,121,245.45′

方法二、toLocaleString

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

varnum = 12345.1234num.toLocaleString();//’12,345.123′

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

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

varb=1234.4542; b.toLocaleString();//’1,234.454′

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

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

functionnumberWithCommas(x) { returnx.toString().replace(/B(?=(d{3})+(?!d))/g, “,”); }

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

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

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

functionnumberWithCommas(x) { varparts = x.toString().split(“.”); parts[0] = parts[0].replace(/B(?=(d{3})+(?!d))/g, “,”); returnparts.join(“.”); }

更简洁,最终代码:

functionnumberWithCommas(x) { returnx.toString().replace(/B(?方法四:Intl.NumberFormat

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

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

letnumber= 1234567890; letnf = newIntl.NumberFormat(‘en-US’); nf.format(number); // “1,234,567,890”

更多实例:

varnumber= 123456.789; console.log(newIntl.NumberFormat(‘de-DE’, { style: ‘currency’, currency: ‘EUR’}).format(number)); // expected output: “123.456,79 €”// the Japanese yen doesn’t use a minor unitconsole.log(newIntl.NumberFormat(‘ja-JP’, { style: ‘currency’, currency: ‘JPY’}).format(number)); // expected output: “¥123,457″// limit to three significant digitsconsole.log(newIntl.NumberFormat(‘en-IN’, { maximumSignificantDigits: 3}).format(number)); // expected output: “1,23,000”

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容,请发送邮件至87172970@qq.com举报,一经查实,本站将立刻删除。

发表评论

登录后才能评论