js金钱格式化
金钱每三位添加“,” 12345678->12,345,678
- 思路1:数字->字符串->倒着每三位加“,”
function format(num){
num=num+'';//数字转字符串
var str="";//字符串累加
for(var i=num.length- 1,j=1;i>=0;i--,j++){
if(j%3==0 && i!=0){//每隔三位加逗号,过滤正好在第一个数字的情况
str+=num[i]+",";//加千分位逗号
continue;
}
str+=num[i];//倒着累加数字
}
return str.split('').reverse().join("");//字符串=>数组=>反转=>字符串
}
- 思路2:将字符串/数字每三位添加至数组中,再转为字符串
function format(num) {
let str=num+'';
let arr = [],
let count = str.length
while (count >= 3) {
arr.unshift(str.slice(count - 3, count))
count -= 3
}
// 如果是不是3的倍数就另外追加到上去
str.length % 3 && arr.unshift(str.slice(0, str.length % 3))
return arr.toString()
}
- 思路3:数字/字符串->转为数组->反转->利用reduce()判断
function format(num) {
let str=num+'';//数字转为字符串
// ["0", "9", "8", "7", "6", "5", "4", "3", "2", "1"]
return str.split("").reverse().reduce((prev, next, index) => {
return ((index % 3) ? next : (next + ',')) + prev
})//reduce 累加器
}
- 思路4:正则表达式
//正则1
function format (num) {
return (num + '').replace(/\d{1,3}(?=(\d{3})+$)/g, '$&,');
}
//正则2
function format(num) {
return (num + '').replace(/\B(?=(\d{3})+(?!\d))/g, ',')
}
- 思路5:JS自带API
(123456789).toLocaleString('en-US') // 1,234,567,890
toLocaleString:将数字转化成指定格式的字符串
自带API:详情可查看MDN文档
含有小数点的金钱格式化
- 思路:将小数点补齐后,分为整数部分和小数部分,整数部分逻辑不变,再加上小数点和小数部分
function format(num) {
num=parseFloat((num + "").replace(/[^\d\.-]/g, "")).toFixed(2) + "";
var intNum = num.toString().split(".")[0];
var floatNum=num.toString().split(".")[1];
return (intNum || 0).toString().replace(/(\d)(?=(?:\d{3})+$)/g, '$1,')+"."+floatNum;
}
输入框内仅允许输入数字及小数点后两位
<input
placeholder="请输入已付金额"
v-model="count"
onkeyup="this.value=this.value.match(/\d+\.?\d{0,2}/);this.dispatchEvent(new Event('input'))"
/>