一、toFixed方法
1、JS中toFixed方法可以将数字保留指定的小数位数,它会四舍五入,并返回一个字符串。
let num1 = 3.145; let num2 = 3.141; console.log(num1.toFixed(2)); // 3.15 console.log(num2.toFixed(2)); // 3.14
2、但是需要注意的是,在数字超出10的15次方时,使用toFixed将会返回科学计数法的形式。
console.log((1234567891234567.89).toFixed(2)); // 1234567891234567.75 console.log((123456789123456789.12).toFixed(2)); // 1.23e+17 console.log((123456789123456789.12).toLocaleString()); // 123,456,789,123,456,800.00
3、当字符串和数字相加时,JS会将字符串转换为数字,如果使用toFixed方法,那么返回的是字符串类型。因此在进行计算时需要进行类型转换。
console.log(10 + 3.14.toFixed(2)); // 13.14 console.log(10 + Number((3.14).toFixed(2))); // 13.14
二、自定义函数实现
1、使用自定义函数可以更灵活的控制保留的小数位数,实现方式主要有两种:正则表达式和数学方法。
2、使用正则表达式实现:
function toFixedByRegExp(num, len) { len = len || 0; let reg = new RegExp(`^\d+(?:\.\d{0,${len}})?`); let stringNum = String(num); let matches = stringNum.match(reg); if (matches) { let result = matches[0]; let matchLen = result.length; if (matchLen < stringNum.length) { let suffix = '0'.repeat(len + 1); result += suffix.slice(1, len + 2); } return Number.parseFloat(result); } else { return NaN; } } console.log(toFixedByRegExp(3.14159, 2)); // 3.14 console.log(toFixedByRegExp(3.14159, 5)); // 3.14159 console.log(toFixedByRegExp(123456789.123456789, 5)); // 123456789.12346
3、使用数学方法实现:
function toFixedByMath(num, len) { len = len || 0; let multip = Math.pow(10, len); let rounded = Math.round(num * multip); let result = rounded / multip; let stringNum = result.toString(); let integerDigits = stringNum.split('.')[0]; let decimalDigits = stringNum.split('.')[1]; if (decimalDigits === undefined) { decimalDigits = ''; } decimalDigits = decimalDigits.padEnd(len, '0'); return `${integerDigits}.${decimalDigits}`; } console.log(toFixedByMath(3.14159, 2)); // 3.14 console.log(toFixedByMath(3.14159, 5)); // 3.14159 console.log(toFixedByMath(123456789.123456789, 5)); // 123456789.12346
三、格式化输出
1、JS中可以使用toLocaleString方法,将数字按照本地化输出(不同地区对数字的表示有所差异),同时对于小数位数过多或过少的数字,也可以使用该方法将其格式化输出。
let num = 1234567.89; console.log(num.toLocaleString()); // 1,234,567.89 console.log(num.toLocaleString('en-US', { maximumFractionDigits: 2 })); // 1,234,567.89 console.log(num.toLocaleString('zh-CN', { maximumFractionDigits: 2 })); // 1,234,567.89 console.log(num.toLocaleString('zh-CN', { maximumFractionDigits: 5 })); // 1,234,567.89000 console.log(num.toLocaleString('en-IN', { maximumFractionDigits: 5 })); // 12,34,567.89000
2、对于需要将格式化的数字作为字符串进行输出的情况,使用toLocaleString可能会导致一些意外的问题,此时可以使用replace方法对逗号和小数点进行替换。
let num = 1234567.89; console.log(num.toLocaleString().replace(/,/g, '_')); // 1_234_567.89 console.log(num.toLocaleString().replace(/./g, '-')); // 1,234,567-89
四、总结
本文介绍了JS中保留两位有效数字的几种常见方式,包括toFixed方法、自定义函数以及格式化输出方法,并且对每种方法进行了详细的阐述和代码示例。在实际开发过程中,根据具体情况选择合适的方式进行保留小数位数的处理,可以使代码更加灵活和高效。