JavaScript中保留小数点后N位方法总结

 更新时间:2023年06月01日 11:59:46   作者:时倾  
这篇文章主要为大家详细介绍了JavaScript中保留小数点后N位的几个常用方法,文中的示例代码讲解详细,感兴趣的小伙伴可以跟随小编一起了解一下

四舍五入保留小数后 n 位

补0: 使用 toFixed(digits) 方法

  • 四舍五入为指定的小数位数
  • 返回字符串
  • 小数实际位数不够指定的位数,不足的部分会补 0
(1).toFixed(2) // '1.00'
(1.2).toFixed(2) // '1.20'
(-2).toFixed(2) // '-2.00'
(1.12345678).toFixed(7) // '1.1234568'

劣势

  • 参数必须是 0 ~ 20 之间的值,包括 0 和 20。参数 < 0 报错。
  • 会出现数字精度问题。详见ECMAScript 中的 toFixed 定义。
(1111111111.1234567891234).toFixed(8) // '1111111111.12345672'

不补0:自定义转换方法

  • 四舍五入为指定的小数位数
  • 返回数字
  • 小数实际位数不够指定的位数,不足的部分不会补 0
function roundFun(number, precision) {
  return Math.round(+number + 'e' + precision) / Math.pow(10, precision);
}
// 或
function roundFun(number, precision) {
  return Math.round(number * Math.pow(10, precision)) / Math.pow(10, precision);
}
roundFun(1, 2) // 1
roundFun(1.2, 2) // 1.2
roundFun(-2, 2) // -2
roundFun(1.12345678, 7) // 1.1234568
roundFun(1111111111.1234567891234, 8) // 1111111111.1234567

精确显示小数后 n 位

不补0

  • 精确保留小数后 n 位
  • 返回数字
  • 小数实际位数不够指定的位数,不足的部分不会补 0
const keepDecimal = (numStr, precision) => {
  const regexp = new RegExp(`^\\d+(?:\\.\\d{0,${precision}})?`)
  const result = numStr.match(regexp)
  return result ? result[0] : '0'
}
keepDecimal('1', 2) // '1'
keepDecimal('1.2', 2) // '1.2'
keepDecimal('1.12345678', 7) // '1.1234567'
keepDecimal('12345.1234567891234', 8) // '12345.12345678'
keepDecimal('123456789.1234567891234', 10) // '123456789.1234567891'

劣势

  • 不支持负数
  • 不支持字符串
keepDecimal('-2', 2) // '0'
keepDecimal('122sss', 10) // '122'
keepDecimal('abcd', 10) // '0'

补0

  • 精确保留小数后 n 位
  • 返回字符串
  • 小数实际位数不够指定的位数,不足的部分会补 0
const keepDecimal = (numStr, precision) => {
  const regexp = new RegExp(`^\\d+(?:\\.\\d{0,${precision}})?`)
  const result = numStr.match(regexp)
  return result ? result[0] : '0'
}

const keepDecimalPlaces = (numStr, precision) => {
  let numberStr = keepDecimal(numStr, precision)
  let rs = numberStr.indexOf('.')
  if (rs < 0 && precision > 0) {
    rs = numberStr.length
    numberStr += '.'
  }
  while (numberStr.length <= rs + precision) {
    numberStr += '0'
  }
  return numberStr
}
keepDecimalPlaces('1', 2) // '1.00'
keepDecimalPlaces('1.2', 2) // '1.20'
keepDecimalPlaces('1.12345678', 7) // '1.1234567'
keepDecimalPlaces('12345.1234567891234', 8) // '12345.12345678'
keepDecimalPlaces('123456789.1234567891234', 10) // '123456789.1234567891'
keepDecimalPlaces('123456789.000001', 10) // '123456789.0000010000'

劣势

  • 不支持负数
  • 不支持字符串
keepDecimalPlaces('-2', 2) // '0.00'
keepDecimalPlaces('122sss', 10) // '122.0000000000'
keepDecimalPlaces('abcd', 10) // '0.0000000000'

 到此这篇关于JavaScript中保留小数点后N位方法总结的文章就介绍到这了,更多相关JavaScript保留小数点内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

相关文章

  • js module大战

    js module大战

    这篇文章主要介绍了js module,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2019-04-04
  • javascript+HTML5的canvas实现七夕情人节3D玫瑰花效果代码

    javascript+HTML5的canvas实现七夕情人节3D玫瑰花效果代码

    这篇文章主要介绍了javascript+HTML5的canvas实现七夕情人节3D玫瑰花效果代码,使用了html5的canvas技术,可呈现出带有3D效果的玫瑰花渐显效果,非常逼真自然,需要的朋友可以参考下
    2015-08-08
  • KnockoutJS 3.X API 第四章之数据控制流with绑定

    KnockoutJS 3.X API 第四章之数据控制流with绑定

    这篇文章主要介绍了KnockoutJS 3.X API 第四章之数据控制流with绑定的相关资料,非常不错,具有参考借鉴价值,需要的朋友可以参考下
    2016-10-10
  • JS中循环字符串拼接时加换行问题

    JS中循环字符串拼接时加换行问题

    这篇文章主要介绍了JS中循环字符串拼接时加换行问题,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
    2023-02-02
  • JavaScript通过prototype给对象定义属性用法实例

    JavaScript通过prototype给对象定义属性用法实例

    这篇文章主要介绍了JavaScript通过prototype给对象定义属性用法,实例分析了prototype的功能及使用技巧,具有一定参考借鉴价值,需要的朋友可以参考下
    2015-03-03
  • layui点击按钮添加可编辑的一行方法

    layui点击按钮添加可编辑的一行方法

    今天小编就为大家分享一篇layui点击按钮添加可编辑的一行方法,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2018-08-08
  • 关于Javascript 的 prototype问题。

    关于Javascript 的 prototype问题。

    关于Javascript 的 prototype问题。...
    2007-01-01
  • 小程序实现展开/收起的效果示例

    小程序实现展开/收起的效果示例

    这篇文章主要介绍了小程序实现展开/收起的效果示例,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2018-09-09
  • ts中的void和never类型及区别

    ts中的void和never类型及区别

    void类型和never类型都是ts新增的类型,这两者的共同点是都常见用于声明函数的返回值的类型,这里我们把它们两放在一起介绍有助于大家区分,这篇文章主要介绍了ts中的void和never类型及区别,需要的朋友可以参考下
    2023-05-05
  • JavaScript中的object转换函数toString()与valueOf()介绍

    JavaScript中的object转换函数toString()与valueOf()介绍

    这篇文章主要介绍了JavaScript中的object转换函数toString()与valueOf()介绍,需要的朋友可以参考下
    2014-12-12

最新评论