使用js，对数值保留小数点后两位的处理（两种情况）

Html部分：

<div class="text primary-text">
<span>合计：</span>
<span class="money">{{totalMoney | numFilter}}</span>
</div>

Js部分：(注意toFixed方法只能用于数值型数据)

//  情况一：保留小数点后两位的过滤器，尾数四舍五入

filters: {
numFilter (value) {
let realVal = ''
if (!isNaN(value) && value!== '') {
// 截取当前数据到小数点后两位
realVal = parseFloat(value).toFixed(2)
} else {
realVal = '-'
}
return realVal
}
}

//  情况二：保留小数点后两位的过滤器，尾数不四舍五入（此处存在一个问题，当源数据小数点第三位为数字9，并且第四位会导致第三位进位的情况下，得到的最终数据仍然不是截取 eg: 3.1798 截取两位会变成3.18）

filters: {
numFilter (value) {
let realVal = ''
if (!isNaN(value) && value!== '') {
// 截取当前数据到小数点后三位
let tempVal = parseFloat(value).toFixed(3)
realVal = tempVal.substring(0, tempVal.length - 1)
} else {
realVal = '-'
}
return realVal
}
}

  //  情况二：优化成如下方式，自行封装成一个公共函数，即用即调 

filters: {
numFilter (value) {
return cutOutNum(value)
}
}
-----
将此函数封装在外部js中
-----
/**
* 对源数据截取decimals位小数，不进行四舍五入
* @param {*} num 源数据
* @param {*} decimals 保留的小数位数
*/
export const cutOutNum = (num, decimals = 2) => {
if (isNaN(num) || (!num && num !== 0)) {
return '-'
}
function toNonExponential (_num) {
var m = Number(_num).toExponential().match(/d(?:.(d*))?e([+-]d+)/)
return Number(_num).toFixed(Math.max(0, (m[1] || '').length - m[2]))
}
// 为了兼容科学计数法的数字
num = toNonExponential(num)
// 获取小数点的位置 + 1（不存在小数点的indexOf值为-1）
const pointIndex = String(num).indexOf('.') + 1
// 获取小数点后的个数(需要保证有小数位)
const pointCount = pointIndex ? String(num).length - pointIndex : 0
// 补零函数
function zeroFill (zeroNum, num) {
for (let index = 0; index < zeroNum; index++) {
num = `${num}0`
}
return num
}
// 源数据为"整数"或者小数点后面小于decimals位的作补零处理
if (pointIndex === 0 || pointCount <= decimals) {
let tempNumA = num
// 区分"整数"和"小数"的补零
if (pointIndex === 0) {
tempNumA = `${tempNumA}.`
tempNumA = zeroFill(decimals - pointCount, tempNumA)
} else {
tempNumA = zeroFill(decimals - pointCount, tempNumA)
}
return String(tempNumA)
}
// 截取当前数据到小数点后decimals位
const Int = String(num).split('.')[0]
const Decimal = String(num).split('.')[1].substring(0, decimals)
const tempNumB = `${Int}.${Decimal}`
// 需求：数据为0时，需要显示为0，而不是0.00...
return Number(tempNumB) === 0 ? 0 : tempNumB
}

最后

以上就是激情流沙为你收集整理的使用js，对数值保留小数点后两位的处理（两种情况）的全部内容，希望文章能够帮你解决使用js，对数值保留小数点后两位的处理（两种情况）所遇到的程序开发问题。

如果觉得靠谱客网站的内容还不错，欢迎将靠谱客网站推荐给程序员好友。