js保留两位小数方法总结

最新推荐文章于 2024-05-15 22:40:52 发布

꧁缘法天地间꧂

最新推荐文章于 2024-05-15 22:40:52 发布

阅读量8.1k

点赞数 1

分类专栏： jQuery 前端文章标签： javascript 开发语言 ecmascript

原文链接：https://www.jb51.net/article/134067.htm

版权

前端同时被 2 个专栏收录

15 篇文章

订阅专栏

jQuery

10 篇文章

订阅专栏

本文详细介绍了JavaScript中保留浮点数两位小数的各种方法，包括四舍五入、不四舍五入、强制保留零等，提供了一系列实用的函数示例，适用于前端开发中数据格式化的场景。文章还涵盖了正则匹配、字符串处理和数学运算等技巧，并探讨了toFixed()方法的使用以及自定义函数的实现。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

本文是小编针对js保留两位小数这个大家经常遇到的经典问题整理了在各种情况下的函数写法以及遇到问题的分析，以下是全部内容：

一、我们首先从经典的“四舍五入”算法讲起

1、四舍五入的情况

1 2	`var` `num =2.446242342;` `num = num.toFixed(2);` `// 输出结果为 2.45`

2、不四舍五入

第一种，先把小数边整数：

1	`Math.floor(15.7784514000 * 100) / 100` `// 输出结果为 15.77`

第二种，当作字符串，使用正则匹配：

1	`Number(15.7784514000.toString().match(/^\d+(?:\.\d{0,2})?/))` `// 输出结果为 15.77,不能用于整数如 10 必须写为10.0000`

注意：如果是负数，请先转换为正数再计算，最后转回负数

再分享一个经典的解决四舍五入问题后js保留两位小数的方法：

//四舍五入保留2位小数（若第二位小数为0，则保留一位小数）

function keepTwoDecimal(num) {

var result = parseFloat(num);

if (isNaN(result)) {

alert('传递参数错误，请检查！');

return false;

}

result = Math.round(num * 100) / 100;

return result;

}

//四舍五入保留2位小数（不够位数，则用0替补）

function keepTwoDecimalFull(num) {

var result = parseFloat(num);

if (isNaN(result)) {

alert('传递参数错误，请检查！');

return false;

}

result = Math.round(num * 100) / 100;

var s_x = result.toString();

var pos_decimal = s_x.indexOf('.');

if (pos_decimal < 0) {

pos_decimal = s_x.length;

s_x += '.';

}

while (s_x.length <= pos_decimal + 2) {

s_x += '0';

}

return s_x;

}

如果大家想对javascript有系统深入的学习，可以参阅 JavaScript启示录 PDF原书完整版这本经典书籍

二、Js取float型小数点后两位数的方法

<script type="text/javascript">

//保留两位小数

//功能：将浮点数四舍五入，取小数点后2位

function toDecimal(x) {

var f = parseFloat(x);

if (isNaN(f)) {

return;

}

f = Math.round(x*100)/100;

return f;

}

//制保留2位小数，如：2，会在2后面补上00.即2.00

function toDecimal2(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;

}

function fomatFloat(src,pos){

return Math.round(src*Math.pow(10, pos))/Math.pow(10, pos);

}

//四舍五入

alert("保留2位小数：" + toDecimal(3.14159267));

alert("强制保留2位小数：" + toDecimal2(3.14159267));

alert("保留2位小数：" + toDecimal(3.14559267));

alert("强制保留2位小数：" + toDecimal2(3.15159267));

alert("保留2位小数：" + fomatFloat(3.14559267, 2));

alert("保留1位小数：" + fomatFloat(3.15159267, 1));

//五舍六入

alert("保留2位小数：" + 1000.003.toFixed(2));

alert("保留1位小数：" + 1000.08.toFixed(1));

alert("保留1位小数：" + 1000.04.toFixed(1));

alert("保留1位小数：" + 1000.05.toFixed(1));

//科学计数

alert(3.1415.toExponential(2));

alert(3.1455.toExponential(2));

alert(3.1445.toExponential(2));

alert(3.1465.toExponential(2));

alert(3.1665.toExponential(1));

//精确到n位，不含n位

alert("精确到小数点第2位" + 3.1415.toPrecision(2));

alert("精确到小数点第3位" + 3.1465.toPrecision(3));

alert("精确到小数点第2位" + 3.1415.toPrecision(2));

alert("精确到小数点第2位" + 3.1455.toPrecision(2));

alert("精确到小数点第5位" + 3.141592679287.toPrecision(5));

</script>

用Javascript取float型小数点后两位，例22.127456取成22.13,如何做？

1.丢弃小数部分,保留整数部分

1	`parseInt(5/2)`

2.向上取整,有小数就整数部分加1

1	`Math.ceil(5/2)`

3,四舍五入.

1	`Math.round(5/2)`

4,向下取整

1	`Math.floor(5/2)`

另类的方法

1. 最笨的办法

function get()

{

var s = 22.127456 + "";

var str = s.substring(0,s.indexOf(".") + 3);

alert(str);

}

2. 正则表达式效果不错

<script type="text/javascript">

onload = function(){

var a = "23.456322";

var aNew;

var re = /([0-9]+.[0-9]{2})[0-9]*/;

aNew = a.replace(re,"$1");

alert(aNew);

}

</script>

3. 他就比较聪明了

<script>

var num=22.127456;

alert( Math.round(num*100)/100);

</script>

4.会用新鲜东西的朋友....... 但是需要 IE5.5+才支持。

5.js保留2位小数（强制）

对于小数点位数大于2位的，用上面的函数没问题，但是如果小于2位的，比如：changeTwoDecimal(3.1)，将返回3.1，如果你一定需要3.10这样的格式，那么需要下面的这个函数：

function changeTwoDecimal_f(x) {

var f_x = parseFloat(x);

if (isNaN(f_x)) {

alert('function:changeTwoDecimal->parameter error');

return false;

}

var f_x = Math.round(x * 100) / 100;

var s_x = f_x.toString();

var pos_decimal = s_x.indexOf('.');

if (pos_decimal < 0) {

pos_decimal = s_x.length;

s_x += '.';

}

while (s_x.length <= pos_decimal + 2) {

s_x += '0';

}

return s_x;

}

三、js保留两位小数，自动补充零

function returnFloat(value){

var value=Math.round(parseFloat(value)*100)/100;

var xsd=value.toString().split(".");

if(xsd.length==1){

value=value.toString()+".00";

return value;

}

if(xsd.length>1){

if(xsd[1].length<2){

value=value.toString()+"0";

}

return value;

}

四、JS取整数,js取绝对值,js四舍五入(可保留两位小数)

JS取整数,js取绝对值,js四舍五入(可保留两位小数)函数如下：

<SCRIPT language=javascript>

<!--

function jsMath()

{

document.write(Math.floor(5.80) + "<br>");//取整或下舍入

document.write(Math.round(5.80) + "<br>");//四舍五入，取整数

document.write(Math.round((5.80*100)/100) + "<br>");//四舍五入，保留两位小数

document.write(Math.ceil(5.10) + "<br>");//上舍入

document.write(Math.abs(-5.80) + "<br>");//取绝对值

document.write(Math.max(55,58) + "<br>");//返回两个值中最大数

document.write(Math.min(55,58) + "<br>");//返回两个值中最小数

}

-->

</SCRIPT>

<div>

<script>jsMath();</script>

</div>

总结

JS数据格式化是在进行web前端开发时常碰到的事情，特别是在数据类型为Float的数据就需要特殊处理，如保留两位小数、小数点后的数据是否需要四舍五入等等。下面就来介绍实现数据格式化保留两位小数的多种方法。

1、JS自带的方法toFixed()，toFixed() 方法可把 Number 四舍五入为指定小数位数的数字。

语法：NumberObject.toFixed(num)，mun是必需的参数，即规定小数的位数，是 0 ~ 20 之间的值，包括 0 和 20，有些实现可以支持更大的数值范围。如果省略了该参数，将用 0 代替，所以toFixed() 方法可以实现保留2位、3位、4位等等，取决于num的数值。

返回值：返回 NumberObject 的字符串表示，不采用指数计数法，小数点后有固定的 num 位数字。如果必要，该数字会被舍入，也可以用 0 补足，以便它达到指定的长度。如果 num 大于 le+21，则该方法只调用 NumberObject.toString()，返回采用指数计数法表示的字符串。

当 num 太小或太大时抛出异常 RangeError。0 ~ 20 之间的值不会引发该异常。有些实现支持更大范围或更小范围内的值。

当调用该方法的对象不是 Number 时抛出 TypeError 异常。

<script type=”text/javascript”>

var num = new Number(13.376954);

document.write (num.toFixed(2))

</script>

输出：13.38

2、自定义函数实现小数保留并四舍五入。