JavaScript 格式化數(shù)字、金額、千分位、保留幾位小數(shù)、舍入舍去
前端開發(fā)中經(jīng)常會(huì)碰到用 JavaScript?格式化數(shù)字,最最常見的是格式化金額,一般格式化金額需要千分位分隔,保留2位小數(shù)等等。
簡(jiǎn)單的功能函數(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ù)說(shuō)明:
* 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ù)
這些代碼基本能很好的運(yùn)行。不過(guò)關(guān)系到經(jīng)濟(jì)利益的時(shí)候,還要考慮舍去或者舍入幾厘。大家懂的,每個(gè)用戶幾厘錢可能帶來(lái)巨大的經(jīng)濟(jì)收益。就比如說(shuō)收手續(xù)費(fèi),如果一筆手續(xù)費(fèi)計(jì)算出來(lái)是 3.4521 元,精確到分一般都會(huì)收 3.46 元。當(dāng)然如果是付出去,那可能就是直接舍去了,一般會(huì)計(jì)算為 3.45 元。
以前收集過(guò)類似方法,不過(guò)在使用的時(shí)候會(huì)有BUG,JS 浮點(diǎn)型計(jì)算的精度問(wèn)題。所以抽時(shí)間修復(fù)了一下:
function number_format(number, decimals, dec_point, thousands_sep,roundtag) {
/*
* 參數(shù)說(shuō)明:
* number:要格式化的數(shù)字
* decimals:保留幾位小數(shù)
* dec_point:小數(shù)點(diǎn)符號(hào)
* thousands_sep:千分位符號(hào)
* roundtag:舍入?yún)?shù),默認(rèn) "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ù)有點(diǎn)多,你可以根據(jù)你自己的需求去修改。
推薦的類庫(kù) Numeral.js 和 accounting.js
Numeral.js
一個(gè)用于格式化和操作數(shù)字的JavaScript庫(kù)。數(shù)字可以被格式化為貨幣,百分比,時(shí)間,幾個(gè)小數(shù)位數(shù),千分位等等。 您也可以隨時(shí)創(chuàng)建自定義格式。
官網(wǎng)及文檔:http://numeraljs.com/
GitHub:https://github.com/adamwdraper/Numeral-js
accounting.js
一個(gè)輕量級(jí)的JavaScript庫(kù),用于格式化數(shù)字,金額和貨幣等。
官網(wǎng)及文檔:http://openexchangerates.github.io/accounting.js/
GitHub:accounting.js
以上就是本文的全部?jī)?nèi)容,希望對(duì)大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。
相關(guān)文章
Javascript和Java獲取各種form表單信息的簡(jiǎn)單實(shí)例
本篇文章主要是對(duì)Javascript和Java獲取各種form表單信息的簡(jiǎn)單實(shí)例進(jìn)行了介紹,需要的朋友可以過(guò)來(lái)參考下,希望對(duì)大家有所幫助2014-02-02
學(xué)習(xí)LayUI時(shí)自研的表單參數(shù)校驗(yàn)框架案例分析
本框架基于LayUI框架寫的表單參數(shù)校驗(yàn)框架,本文分過(guò)實(shí)例代碼給大家介紹的非常詳細(xì),具有一定的參考借鑒價(jià)值,需要的朋友參考下吧2019-07-07
JavaScript之iterable_動(dòng)力節(jié)點(diǎn)Java學(xué)院整理
這篇文章主要介紹了JavaScript之iterable,遍歷Array可以采用下標(biāo)循環(huán),遍歷Map和Set就無(wú)法使用下標(biāo)。為了統(tǒng)一集合類型,ES6標(biāo)準(zhǔn)引入了新的iterable類型,Array、Map和Set都屬于iterable類型2017-06-06
Javacript實(shí)現(xiàn)顏色梯度變化和漸變的效果代碼
用js對(duì)導(dǎo)航欄的顏色做了梯度的變化處理,通過(guò)處理..獲取兩種顏色在變化時(shí)的各種顏色字符串,并且字符串的個(gè)數(shù),即獲取的頻率可以調(diào)節(jié)2013-05-05
Mysql內(nèi)儲(chǔ)存JSON字符串根據(jù)條件進(jìn)行查詢
本文主要介紹了Mysql內(nèi)儲(chǔ)存JSON字符串根據(jù)條件進(jìn)行查詢,文中通過(guò)示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2022-02-02
淺談在fetch方法中添加header后遇到的預(yù)檢請(qǐng)求問(wèn)題
下面小編就為大家?guī)?lái)一篇淺談在fetch方法中添加header后遇到的預(yù)檢請(qǐng)求問(wèn)題。小編覺得挺不錯(cuò)的,現(xiàn)在就分享給大家,也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2017-08-08
javascript獲取四位數(shù)字或者字母的隨機(jī)數(shù)
這篇文章主要介紹了javascript獲取四位數(shù)字或者字母的隨機(jī)數(shù),需要的朋友可以參考下2015-01-01
webpack中splitChunks分包策略的實(shí)現(xiàn)
splitChunks是 webpack 中用于分包的配置選項(xiàng)之一,本文主要介紹了webpack中splitChunks分包策略的實(shí)現(xiàn),具有一定的參考價(jià)值,感興趣的可以了解一下2024-06-06

