JS如何去掉小数末尾多余的0,并且最多保留两位小数

 更新时间:2023年04月13日 16:18:29   作者:小太阳...  
这篇文章主要介绍了JS如何去掉小数末尾多余的0,并且最多保留两位小数问题,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教

js去掉小数末尾多余的0,并且最多保留两位小数

比如:

'' -> 0
0.00 -> 0
1 -> 1
1.10 -> 1
1.213000 -> 1.21
1.01 -> 1.01

代码如下:

思路

用JavaScript的parseFloat函数,parseFloat(’ ') 是NaN,返回0,然后用parseFloat转换字符串或者数字,判断是否是小数并且小数点后超过两位,超过两位就转成两位小数,不超过就直接返回。

  function unifyNumber(num) {
    if (num === '') {
      return 0
    } else {
      let handleNum = parseFloat(num)
      let isToFixed = handleNum.toString().includes('.') && handleNum.toString().split('.')[1].length > 2
      if (isToFixed) {
        return handleNum.toFixed(2)
      } else {
        return handleNum
      }
    }
  }

注意: 如果字符串的第一个字符不能被转换为数字,那么 parseFloat() 会返回 NaN

js去掉小数点后面的0 (uniapp 和 vue比较适用)

在项目中后端返回的数据是这样的

由于移动空间比较小,00 也比较占用空间,干脆去掉,美观又好看

var a=11.00;console.log(a);;数字类型用的时候直接就去掉了无用的0
var a=‘11.00';console.log(Number(a));

字符串类型转成数字类型也就直接去掉了后面没用的0

OK了~

总结

以上为个人经验,希望能给大家一个参考,也希望大家多多支持脚本之家。

相关文章

  • js中如何复制一个对象并获取其所有属性和属性对应的值

    js中如何复制一个对象并获取其所有属性和属性对应的值

    如果知道这个对象的所有属性自然就可以重新new一个,然后对每个属性赋值,就可以做到,但如果不知道呢?如何创建一个内容相同 的对象呢?下面有个不错的示例,大家可以看看
    2013-10-10
  • 微信小程序配置视图层数据绑定相关示例

    微信小程序配置视图层数据绑定相关示例

    这篇文章主要为大家介绍了微信小程序配置视图层数据绑定相关示例,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步早日升职加薪<BR>
    2022-04-04
  • JS 动态获取节点代码innerHTML分析 [IE,FF]

    JS 动态获取节点代码innerHTML分析 [IE,FF]

    在IE 环境下 赋值类型为对象时 innerHTML 获取不到其改变,在FireFox环境下 .属性 方式获取不到其改变。
    2009-11-11
  • js实现上一页下一页的效果【附代码】

    js实现上一页下一页的效果【附代码】

    下面小编就为大家带来一篇js实现上一页下一页的效果【附代码】。小编觉得非常不错。现在分享给大家。希望能给大家一个参考。
    2016-03-03
  • 小程序实现图片预览裁剪插件

    小程序实现图片预览裁剪插件

    这篇文章主要为大家详细介绍了小程序实现图片预览裁剪插件,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2019-11-11
  • 关于ES6尾调用优化的使用

    关于ES6尾调用优化的使用

    这篇文章主要介绍了关于ES6尾调用优化的使用,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2020-09-09
  • JavaScript 自定义事件之我见

    JavaScript 自定义事件之我见

    事件就是用户和浏览器交互的一种途径,在本例中我们的代码逻辑一般就是收集用户填写信息,验证信息合法性,利用AJAX与服务器交互,需要的朋友可以参考下
    2017-09-09
  • 前端接口报错302问题解决办法

    前端接口报错302问题解决办法

    这篇文章主要介绍了前端接口报错302的问题,并提供了多种解决方法和代码案例,帮助开发者更好地应对这一常见问题,需要的朋友可以参考下
    2025-01-01
  • 页面实时更新时间的JS实例代码

    页面实时更新时间的JS实例代码

    这篇文章主要介绍了页面实时更新时间的JS实例代码,有需要的朋友可以参考一下
    2013-12-12
  • 在小程序中使用腾讯视频插件播放教程视频的方法

    在小程序中使用腾讯视频插件播放教程视频的方法

    这篇文章主要介绍了在小程序中使用腾讯视频插件播放教程视频的方法,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2018-07-07

最新评论