深圳网站设计机构wordpress4.9.8主题
千分位格式化 —> 金额格式化
// 1000 —> 1,000
// 10000 —> 10,000
// 100000 —> 100,000
// 1000000 —> 1,000,000
目录
目标：如何实现千分位格式化？（你有几种方式实现）
方法一字符串的方式实现
方法三——每次截取三位末尾字符串
方法四——toLocaleString
测试结果
目标：如何实现千分位格式化？（你有几种方式实现）
方法一字符串的方式实现
function?toThousands(num) {????var?result =?'', counter = 0;????num = (num || 0).toString();????for?(var?i = num.length - 1; i >= 0; i--) {????????counter++;????????result = num.charAt(i) + result;????????if?(!(counter % 3) && i != 0) { result =?','?+ result; }????}????return?result;}
或者：
function fn(str) {let arr = str.toString().split('').reverse();console.log("arr:", arr);// [8, 7, 6, 5, 4, 3, 2, 1] // 876, 543, 21 ---> 12, 345, 678let st = ""; // 用来接收数据arr.forEach( (cv, i) => {if(i !=0 && i%3 == 0) {st = cv + ',' + st;} else {st = cv + st;}})return st;
}
let str = 1234;
let s = fn(str);
console.log("s:", s); */function fn(str) {var arr = str.split('');for(var i=arr.length-1; i>= 0; i-=3) {if(i != arr.length-1) {arr.splice(i+1, 0, ',');}}console.log("arr:", arr);let st = arr.join('');console.log('st:', st);
}
let n = "12345678901";
fn(n);
方法二——正则版
function toThousands(num) {return (num || 0).toString().replace(/(d)(?=(?:d{3})+$)/g, '$1,');
}
方法三——每次截取三位末尾字符串
function?toThousands(num) {????var?num = (num || 0).toString(), result =?'';????while?(num.length > 3) {????????result =?','?+ num.slice(-3) + result;????????num = num.slice(0, num.length - 3);????}????if?(num) { result = num + result; }????return?result;}
方法四——toLocaleString
1
(``'2525235235235325'``).toLocaleString()
测试结果
数字
执行50000次消耗的时间（ms）
方法一
方法二
方法三
方法四
1
28
231
24
27
10
37
199
25
28
100
46
214
24
27
1000
57
304
49
26
10000
65
293
49
27
100000
75
307
55
28
方法四性能最好.但我暂时不考虑使用,因为:
注意:使用方法四有2个问题:
1:要先把数字转化成字符串才能达到表格所示的消耗时间.直接操作数据效率会打折.
2.在华为的手机上有bug,并不会转化加逗号,还是原模原样展现.应该是机型太老旧问题,现在手机应该没问题,以后兼容没问题肯定首选.
方法二的测试结果告诉我们，代码长短跟性能高低没有关系。方法三的综合性能是最好的:
- 对比方法一，每次操作3个字符而不是1个字符，减少循环次数；
- 对比方法二，使用正则表达式，最浪费性能。
最后，选择了方法三作为最终的优化方案。