温馨提示×

温馨提示×

您好,登录后才能下订单哦!

密码登录×
登录注册×
其他方式登录
点击 登录注册 即表示同意《亿速云用户服务条款》

实现js保留两位小数的方法

发布时间:2023-09-18 13:33:55 来源:亿速云 阅读:106 作者:栢白 栏目:开发技术

今天小编给大家分享的是实现js保留两位小数的方法,相信很多人都不太了解,为了让大家更加了解,所以给大家总结了以下内容,一起往下看吧。一定会有所收获的哦。

前言

日常开发中,后台会返给我们各式各样的数据,如果后台给你返回如下数据时,是不是就已经压制不住心中的怒火了,别急,其实前端处理这些数据还是非常简单的,下面用最简单的方法教你如何1分钟处理好这些数据。

返回数据示例:

3.1415926535897
85.452655625313
99.128532659596

话不多说,下面直接进入实战

1. toFixed() 方法

toFixed() 方法用于把数字转换为字符串,结果的小数点后有指定位数的数字。

参数描述
x必需的参数。规定小数的位数,可取 0 ~ 20 之间的值,包括 0 和 20,有些实现可以支持更大的数值范围。如果省略了该参数,将用 0 代替。

实例

let numBer = 3.1415926;
numBer = numBer.toFixed(2);
console.log(numBer); // 3.14

注意:

该方法会将数值四舍五入,例如 3.148 经过 toFixed(2) 方法得到的结果将是 3.15toFixed() 方法会改变数据类型为字符串。

2. Math.floor() 方法

Math.floor() 方法返回小于或等于一个给定数字的最大整数,可以理解 Math.floor() 为向下取整;其相对的是 Math.ceil(),此方法是向上取整。

参数描述
x必需的参数。任意数值或表达式。

实例

let numBer = 3.1415926;
numBer = Math.floor(numBer * 100) / 100;
console.log(numBer); // 3.14

注意:

该方法不会修改原有数据类型。

3. 字符串+正则匹配

实例

let numBer = 3.1415926;
numBer = Number(numBer.toString().match(/^\d+(?:\.\d{0,2})?/));
console.log(numBer);// 3.14

4. 强制保留2位小数(例如3.00)

实例

let numBer = 3;
numBer = this.numWay(numBer);// 调用numWay方法
console.log(numBer); // 3.00

methods 方法代码

methods: {
  numWay(x) {
    var f = parseFloat(x);
    if (isNaN(f)) {
      return false;
    }
    var f = Math.round(x * 100) / 100;
    var s = f.toString();
    var rs = s.indexOf(".");
    if (rs < 0) {
      rs = s.length;
      s += ".";
    }
    while (s.length <= rs + 2) {
      s += "0";
    }
    return s;
  },
},

5. 四舍五入保留2位小数(若第二位小数为0,则保留一位小数)

实例

let numBer = 3.1001;
numBer = this.numDelivery(numBer);// 调用numDelivery方法
console.log(numBer); // 3.1

methods 方法代码

methods: {
  numDelivery(num) {
    var result = parseFloat(num);
    if (isNaN(result)) {
      alert("传递参数错误,请检查!");
      return false;
    }
    result = Math.round(num * 100) / 100;
    return result;
  },
},

6. substring()方法 + indexOf()方法

substring() 方法用于提取字符串中介于两个指定下标之间的字符。返回的子串包括 开始 处的字符,但不包括 结束 处的字符

参数描述
from必需的参数。一个非负的整数,规定要提取的子串的第一个字符在 string Object 中的位置。
to非必需的参数。一个非负的整数,比要提取的子串的最后一个字符在 string Object 中的位置多 1。如果省略该参数,那么返回的子串会一直到字符串的结尾。

indexOf() 方法可返回某个指定的字符串值在字符串中首次出现的位置,如果没有找到匹配的字符串则返回 -1

参数描述
searchvalue必需的参数。规定需检索的字符串值。
start可选的整数参数。规定在字符串中开始检索的位置。它的合法取值是 0 到 string Object.length - 1。如省略该参数,则将从字符串的首字符开始检索。

实例

let numBer = 3.1415926 + "";
var str = numBer.substring(0, numBer.indexOf(".") + 3);
console.log(str);// 3.14

拓展

为了方便,我们可以写一个专门的方法,需要的时候调用即可。如下代码:

<template>
  <div>
    {{this.getValue(719.0721)}}
  </div>
</template>
<script>
export default {
  methods: {
    getValue(val) {
      return val.toFixed(2);
    },
  },
};
</script>

页面展示

实现js保留两位小数的方法

关于实现js保留两位小数的方法就分享到这里了,希望以上内容可以对大家有一定的参考价值,可以学以致用。如果喜欢本篇文章,不妨把它分享出去让更多的人看到。

向AI问一下细节

免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。

js
AI