关于钱包金额的校验逻辑

山仞
169 阅读2分钟

众所周知业务中对于钱包金额的需求是非常频繁且重要的, 尤其涉及到电商, 提现等领域, 这段时间正好在做此类业务, 在针对于用户输入金额提现的校验逻辑整理了一下, 做这块的时候是比我想象的还要复杂的, 要考虑多种情况, 感觉就是在写计算器一样, 当然这里不涉及到加减乘除, 只是最基础的输入金额逻辑, 复杂度肯定没有计算器高, 以后打算也出一个写计算器的文章, 哈哈, 废话不多说, 直接上干货

温馨提示: 本次实现使用 JS 完成, 但逻辑都是通用的, 不限语言, 主要原理是利用正则表达式来限制输入

禁止输入非数字和点

text.replace(/[^\d.]+/, '');

[]: 定义匹配的字符范围

^: 在 [] 号内意思是匹配取反, 也就是不是数字和点的符号

\d: 匹配数字

.: 匹配点号

+: 出现一次或多次

text.replace 是 JS 的替换字符串的方法, 具体请看 String.prototype.replace()

禁止以点开头

text.replace(/^./g, '');

^.: 以点开头

g: 全局匹配

注意: 这里的 ^ 与上面 ^ 含义不一样, 在 [] 内就表示匹配非 xx 字符, 在外部表示以 xx 开头

禁止连续两次输入点

text.replace(/.{2,}/g, '.');

{2,}: 表示连续出现 2 及以上

一个点后面禁止输入点

这时掏出计算器可以试一下, 计算器只能输入一个小数点, 同样金额也一样

text.replace('.', '$#$')
    .replace(/./g, '')
    .replace('$#$', '.');

第一行: 替换点号为 #

第二行: 全局查找点号替换为空字符串

第三行: 把#还原为点号

禁止小数超过两位

text.replace(/^(-)*(\d+).(\d\d).*$/, '$1$2.$3');

^(-)*: 以 - 号开头出现 0 次或多次, 第一个分组

(\d+): 数字出现一次或多次, 第二个分组

.: 匹配点号

(\d\d): 两位数字, 这里可以随这需求更换, 一个 \d 表示一位, 第三个分组

.*: 贪婪匹配

112.$3: 正则匹配的分组替换为变量名, 改变输入的形式, 这里是 replace 方法的特性

​

编辑切换为居中

replace 方法变量解释

禁止开头连续输入两个0

text.replace(/^0+/, '0');

^0+: 以 0 开头出现一次或多次

输入字符大于等于 1 时剔除开头的 0

if (Number(text) >= 1) {
  text = text.replace(/^0+/, '');
}

这里需要转换一下数字类型, 进行判断, 然后进行匹配

总结

text.replace(/[^\d.]+/, ''); // 禁止非数字和点
text.replace(/^./g, ''); // 禁止以点开头
text.replace(/.{2,}/g, '.'); // 禁止连两次输入点
text.replace('.', '$#$')?.replace(/./g, '')?.replace('$#$', '.'); // 一个点后面禁止输入点
text.replace(/^(-)*(\d+).(\d\d).*$/, '$1$2.$3'); // 禁止小数超过两位
text.replace(/^0+/, '0'); // 禁止开头连续输入两个0
if (Number(text) >= 1) 
 text = text.replace(/^0+/, ''); // 输入字符大于等于 1 时剔除开头的 0 
}

此次金额校验使用到了 JS 的 replace 和 正则表达式 的知识, 一个输入金额的小功能还是要从多种场景来考虑和衡量, 如果对此篇文章有任何的建议, 可以在评论区讨论, 感谢观看

avatar
文章
阅读
粉丝