js⾦额千分位的6种实现⽅法实例
⽬录
⽅法⼀数组分割法
js正则表达式判断数字
⽅法⼆字符截取法
⽅法三求模法
⽅法四正则表达式(先⾏断⾔)
⽅法五通过Intl.NumberFormat
⽅法六 LocaleString⽅式
总结
⽅法⼀数组分割法
这种⽅法也是⾃⼰最容易想到的⼀种⽅式，通过将数组以点分割，然后按照3位⼀体进⾏字符的拼接
function format_with_array(number) {
// 转为字符串，并按照.拆分
const arr = (number + '').split('.');
// 整数部分再拆分
const int = arr[0].split('');
// ⼩数部分
const fraction = arr[1] || '';
// 返回的变量
let r = '';
// ⾮第⼀位并且是位值是3的倍数，添加“,”
if (i !== 0 && i % 3 === 0) {
r = v + ',' + r;
} else {
// 正常添加字符(这是好写法)
r = v + r;
}
});
// 整数部分和⼩数部分拼接
return r + (!!fraction ? '.' + fraction : '');
}
// 测试⽤例
console.log(format_with_array(1234567893.99));
⽅法⼆字符截取法
字符截取法，具体看看注释
function format_with_substring(number) {
// 数字转为字符串，并按照 .分割
let arr = (number + '').split('.');
let int = arr[0] + '';
let fraction = arr[1] || '';
// 多余的位数
let f = int.length % 3;
// 获取多余的位数，f可能是0，即r可能是空字符串
let r = int.substring(0, f);
// 每三位添加','⾦额对应的字符
for (let i = 0; i < Math.floor(int.length / 3); i++) {
r += ',' + int.substring(f + i * 3, f + (i + 1) * 3);
}
// 多余的位数，上⾯
if (f === 0) {
r = r.substring(1);
}
// 调整部分和⼩数部分拼接
return r + (!!fraction ? '.' + fraction : '');
}
console.log(format_with_substring(12112123313.78));
⽅法三求模法
这种⽅法按照⽤1000求模取末尾3位，然后⽤除法判断是否还有剩余位数的⽅法去做的，这种⽅法性能也是最好的，推荐⼤
function format_with_mod(number) {
let n = number;
let r = '';
let temp = '';
do {
// 求模的值，⽤于获取⾼三位，这⾥可能有⼩数
mod = n % 1000;
// 值是不是⼤于1，是继续的条件
n = n / 1000;
// ⾼三位
temp = ~~mod;
// 1.填充: n > 1 循环未结束，就要填充为⽐如 1 => 001
// 不然temp = ~~mod的时候, 1 001，就会变成 "11"
// 2.拼接“,”
r = (n >= 1 ? `${temp}`.padStart(3, '0') : temp) + (!!r ? ',' + r : '');
} while (n >= 1);
const strNumber = number + '';
let index = strNumber.indexOf('.');
/
/ 拼接⼩数部分
if (index >= 0) {
r += strNumber.substring(index);
}
return r;
}
console.log(format_with_mod(1234567893.99));
⽅法四正则表达式(先⾏断⾔)
说这种⽅法前，我们来了解下什么是先⾏断⾔吧！看例⼦。
有以下字符串: 我爱你我爱爱爱你
如果要取出爱字，要求这个爱字后⾯有你，这个时候就要这么写，这就是先⾏断⾔：
'我爱你我爱爱爱你'.match(/爱(?=你)/g) // ["爱", "爱"]
如果要求爱字后⾯没有你，那⾃然也有先⾏否定断⾔：
'我爱你我爱爱爱你'.match(/爱(?!你)/g) // ["爱", "爱"] ，因为匹配相同...
这个时候，如果要求爱字后⾯有你，前⾯还要有我，那就要⽤到后⾏断⾔了，如下：
'我爱你我爱爱爱你'.match(/(?<=我)爱(?=你)/g) // ["爱"]
最后，如果要求爱字前⾯没有我，后⾯也没有我，那就要⽤到先⾏否定断⾔和**后⾏否定断⾔，**如下：'我爱你我爱爱爱你'.match(/(?<!我)爱(?!你)/g) // ["爱"]
所以正则表达式还是⽐较灵活的，接下来，让我们⼀起来瞅瞅正则表达式是如何来玩千分位的，上代码。
function format_with_regex(number) {
return !(number + '').includes('.')
// 就是说1-3位后⾯⼀定要匹配3位
(number + '').replace(/\d{1,3}(?=(\d{3})+$)/g, (match) => {
return match + ',';
})
: (number + '').replace(/\d{1,3}(?=(\d{3})+(\.))/g, (match) => {
return match + ',';
});
}
console.log(format_with_regex(1243250.99));
第四⾏ d{1,3} 数字出现1-3次，后⾯紧紧跟随着3个数字，如1243250，⾸先243前⾯有1，符合条件所以是1,243；后⾯250前⾯是243符合条件，所以是1,243,250
⽅法五通过Intl.NumberFormat
这种⽅法是我在往上⽆意种发现的，使⽤这种⽅式会导致函数不断的初始化，会导致性能上的问题。
function format_with_Intl(
minimumFractionDigits,
maximumFractionDigits
) {
minimumFractionDigits = minimumFractionDigits || 2;
minimumFractionDigits = maximumFractionDigits || 2;
maximumFractionDigits = Math.max(
minimumFractionDigits,
maximumFractionDigits
);
return new Intl.NumberFormat('en-us', {
maximumFractionDigits: maximumFractionDigits || 2,
minimumFractionDigits: minimumFractionDigits || 2,
}).format(number);
}
console.log(format_with_Intl(123456789.98));
⽅法六 LocaleString⽅式
这个是通过js带的api来的，和⽅法五⼀样会有性能上的问题。
function format_with_toLocalString(
number,
minimumFractionDigits,
maximumFractionDigits
)
{
minimumFractionDigits = minimumFractionDigits || 2;
minimumFractionDigits = maximumFractionDigits || 2;
maximumFractionDigits = Math.max(
minimumFractionDigits,
maximumFractionDigits
);
LocaleString('en-us', {
maximumFractionDigits: maximumFractionDigits || 2,
minimumFractionDigits: minimumFractionDigits || 2,
});
}
console.log(format_with_toLocalString(123456789.58));
总结
到此这篇关于js⾦额千分位的6种实现⽅法的⽂章就介绍到这了，更多相关js ⾦额千分位内容请搜索以前的⽂章或继续浏览下⾯的相关⽂章希望⼤家以后多多⽀持！

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。