js保留兩位小數方法總結

本文是小編針對js保留兩位小數這個你們常常遇到的經典問題整理了在各類狀況下的函數寫法以及遇到問題的分析,如下是所有內容:javascript

1、咱們首先從經典的「四捨五入」算法講起

一、四捨五入的狀況

var num =2.446242342;
num = num.toFixed(2); // 輸出結果爲 2.45


二、不四捨五入

第一種,先把小數邊整數:前端

Math.floor(15.7784514000 * 100) / 100 // 輸出結果爲 15.77


第二種,看成字符串,使用正則匹配:java

Number(15.7784514000.toString().match(/^\d+(?:\.\d{0,2})?/)) // 輸出結果爲 15.77,不能用於整數如 10 必須寫爲10.0000


注意:若是是負數,請先轉換爲正數再計算,最後轉回負數git

再分享一個經典的解決四捨五入問題後js保留兩位小數的方法:web

//四捨五入保留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;

}

2、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.丟棄小數部分,保留整數部分算法

parseInt(5/2)


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

Math.ceil(5/2)


3,四捨五入.spa

Math.round(5/2)


4,向下取整code

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;

}


3、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;

 }

}


4、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的數據就須要特殊處理,如保留兩位小數、小數點後的數據是否須要四捨五入等等。下面就來介紹實現數據格式化保留兩位小數的多種方法。

一、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


二、自定義函數實現小數保留並四捨五入。

function roundFun(numberRound,roundDigit) { //四捨五入,保留位數爲roundDigit

if (numberRound>=0){

var tempNumber = parseInt((numberRound * Math.pow(10,roundDigit)+0.5))/Math.pow(10,roundDigit);

return tempNumber;

} else{

numberRound1=-numberRound;

var tempNumber = parseInt((numberRound1 * Math.pow(10,roundDigit)+0.5))/Math.pow(10,roundDigit);

return -tempNumber;

}

}


而後調用roundFun()這個函數就能夠了。如roundFun('13.376954′,2);固然返回的結果跟第一種方法是同樣的。

三、經過函數截取,截取到小數點後面第幾位,固然這種方法就沒有四捨五入了。

<script type=」text/javascript」>

tmp = 13.376954″

result = tmp.substr(0,tmp.indexOf(「.」)+2);

alert(result);

</script>
相關文章
相關標籤/搜索