溫馨提示×

溫馨提示×

您好,登錄后才能下訂單哦!

密碼登錄×
登錄注冊×
其他方式登錄
點擊 登錄注冊 即表示同意《億速云用戶服務條款》

JavaScript如何格式化數(shù)字、金額、千分位、保留幾位小數(shù)、舍入舍去

發(fā)布時間:2021-08-11 14:19:41 來源:億速云 閱讀:281 作者:小新 欄目:web開發(fā)

小編給大家分享一下JavaScript如何格式化數(shù)字、金額、千分位、保留幾位小數(shù)、舍入舍去,相信大部分人都還不怎么了解,因此分享這篇文章給大家參考一下,希望大家閱讀完這篇文章后大有收獲,下面讓我們一起去了解一下吧!

前端開發(fā)中經(jīng)常會碰到用 JavaScript?格式化數(shù)字,最最常見的是格式化金額,一般格式化金額需要千分位分隔,保留2位小數(shù)等等。

簡單的功能函數(shù)

類似的代碼網(wǎng)上有很多:

/**
 * 將數(shù)值四舍五入(保留2位小數(shù))后格式化成金額形式
 *
 * @param num 數(shù)值(Number或者String)
 * @return 金額格式的字符串,如'1,234,567.45'
 * @type String
 */
function formatCurrency(num) {
  num = num.toString().replace(/\$|\,/g,'');
  if(isNaN(num))
    num = "0";
  sign = (num == (num = Math.abs(num)));
  num = Math.floor(num*100+0.50000000001);
  cents = num%100;
  num = Math.floor(num/100).toString();
  if(cents<10)
  cents = "0" + cents;
  for (var i = 0; i < Math.floor((num.length-(1+i))/3); i++)
  num = num.substring(0,num.length-(4*i+3))+','+
  num.substring(num.length-(4*i+3));
  return (((sign)?'':'-') + num + '.' + cents);
}

或者

function fmoney(s, n) {
  /*
   * 參數(shù)說明:
   * s:要格式化的數(shù)字
   * n:保留幾位小數(shù)
   * */
  n = n > 0 && n <= 20 ? n : 2;
  s = parseFloat((s + "").replace(/[^\d\.-]/g, "")).toFixed(n) + "";
  var l = s.split(".")[0].split("").reverse(),
    r = s.split(".")[1];
  t = "";
  for (i = 0; i < l.length; i++) {
    t += l[i] + ((i + 1) % 3 == 0 && (i + 1) != l.length ? "," : "");
  }
  return t.split("").reverse().join("") + "." + r;
}
//調(diào)用
fmoney(9.7,2);//9.70
fmoney('12345.675910', 3);//12,345.676

更加完善的功能函數(shù)

這些代碼基本能很好的運行。不過關(guān)系到經(jīng)濟利益的時候,還要考慮舍去或者舍入幾厘。大家懂的,每個用戶幾厘錢可能帶來巨大的經(jīng)濟收益。就比如說收手續(xù)費,如果一筆手續(xù)費計算出來是 3.4521 元,精確到分一般都會收 3.46 元。當然如果是付出去,那可能就是直接舍去了,一般會計算為 3.45 元。

以前收集過類似方法,不過在使用的時候會有BUG,JS 浮點型計算的精度問題。所以抽時間修復了一下:

function number_format(number, decimals, dec_point, thousands_sep,roundtag) {
  /*
  * 參數(shù)說明:
  * number:要格式化的數(shù)字
  * decimals:保留幾位小數(shù)
  * dec_point:小數(shù)點符號
  * thousands_sep:千分位符號
  * roundtag:舍入?yún)?shù),默認 "ceil" 向上取,"floor"向下取,"round" 四舍五入
  * */
  number = (number + '').replace(/[^0-9+-Ee.]/g, '');
  roundtag = roundtag || "ceil"; //"ceil","floor","round"
  var n = !isFinite(+number) ? 0 : +number,
    prec = !isFinite(+decimals) ? 0 : Math.abs(decimals),
    sep = (typeof thousands_sep === 'undefined') ? ',' : thousands_sep,
    dec = (typeof dec_point === 'undefined') ? '.' : dec_point,
    s = '',
    toFixedFix = function (n, prec) {
 
      var k = Math.pow(10, prec);
      console.log();
 
      return '' + parseFloat(Math[roundtag](parseFloat((n * k).toFixed(prec*2))).toFixed(prec*2)) / k;
    };
  s = (prec ? toFixedFix(n, prec) : '' + Math.round(n)).split('.');
  var re = /(-?\d+)(\d{3})/;
  while (re.test(s[0])) {
    s[0] = s[0].replace(re, "$1" + sep + "$2");
  }
 
  if ((s[1] || '').length < prec) {
    s[1] = s[1] || '';
    s[1] += new Array(prec - s[1].length + 1).join('0');
  }
  return s.join(dec);
}
console.log(number_format(2, 2, ".", ","))//"2.00"
console.log(number_format(3.7, 2, ".", ","))//"3.70"
console.log(number_format(3, 0, ".", ",")) //"3"
console.log(number_format(9.0312, 2, ".", ","))//"9.03"
console.log(number_format(9.00, 2, ".", ","))//"9.00"
console.log(number_format(39.715001, 2, ".", ",", "floor")) //"39.71"
console.log(number_format(9.7, 2, ".", ","))//"9.70"
console.log(number_format(39.7, 2, ".", ","))//"39.70"
console.log(number_format(9.70001, 2, ".", ","))//"9.71"
console.log(number_format(39.70001, 2, ".", ","))//"39.71"
console.log(number_format(9996.03, 2, ".", ","))//"9996.03"
console.log(number_format(1.797, 3, ".", ",", "floor"))//"1.797"

參數(shù)有點多,你可以根據(jù)你自己的需求去修改。

推薦的類庫 Numeral.js 和 accounting.js

Numeral.js

一個用于格式化和操作數(shù)字的JavaScript庫。數(shù)字可以被格式化為貨幣,百分比,時間,幾個小數(shù)位數(shù),千分位等等。 您也可以隨時創(chuàng)建自定義格式。

官網(wǎng)及文檔:http://numeraljs.com/

GitHub:https://github.com/adamwdraper/Numeral-js

accounting.js

一個輕量級的JavaScript庫,用于格式化數(shù)字,金額和貨幣等。

以上是“JavaScript如何格式化數(shù)字、金額、千分位、保留幾位小數(shù)、舍入舍去”這篇文章的所有內(nèi)容,感謝各位的閱讀!相信大家都有了一定的了解,希望分享的內(nèi)容對大家有所幫助,如果還想學習更多知識,歡迎關(guān)注億速云行業(yè)資訊頻道!

向AI問一下細節(jié)

免責聲明:本站發(fā)布的內(nèi)容(圖片、視頻和文字)以原創(chuàng)、轉(zhuǎn)載和分享為主,文章觀點不代表本網(wǎng)站立場,如果涉及侵權(quán)請聯(lián)系站長郵箱:is@yisu.com進行舉報,并提供相關(guān)證據(jù),一經(jīng)查實,將立刻刪除涉嫌侵權(quán)內(nèi)容。

AI