Javascript中toFixed計(jì)算錯(cuò)誤(依賴銀行家舍入法的缺陷)解決方法
前言
在公司項(xiàng)目中涉及到一個(gè)有大量浮點(diǎn)數(shù)價(jià)格計(jì)算的模塊,從而引發(fā)了我一系列的思考:
計(jì)算機(jī)二進(jìn)制環(huán)境下浮點(diǎn)數(shù)的計(jì)算精度缺失問(wèn)題;
console.log(.1+.2); 0.30000000000000004
為了解決上述問(wèn)題,使用了toFixed方法卻出現(xiàn)了浮點(diǎn)數(shù)小數(shù)位以5結(jié)尾的四舍五入錯(cuò)誤問(wèn)題;
var num = 0.045; console.log(num.toFixed(2)); 0.04
以此為起點(diǎn),引發(fā)了我關(guān)于toFixed的一系列探索,終于找到了一些有用的信息,toFixed使用的計(jì)算規(guī)則是:
銀行家舍入:所謂銀行家舍入法,其實(shí)質(zhì)是一種四舍六入五取偶(又稱四舍六入五留雙)法。
簡(jiǎn)單來(lái)說(shuō)就是:四舍六入五考慮,五后非零就進(jìn)一,五后為零看奇偶,五前為偶應(yīng)舍去,五前為奇要進(jìn)一。
正文
下面我們就來(lái)證實(shí)這個(gè)所謂的銀行家舍入法,證實(shí)分為三種情況,分別以4、5、6為舍入位對(duì)toFixed的證實(shí)(以chrome為例):
以4為舍入位:
var num = 0.004; console.log(num.toFixed(2)); 0.00 var num = 0.014; console.log(num.toFixed(2)); 0.01 var num = 0.094; console.log(num.toFixed(2)); 0.09
在4結(jié)尾這種情況下toFixed表現(xiàn)的還算不錯(cuò),并沒(méi)有錯(cuò)誤的問(wèn)題。
以6為舍入位:
var num = 0.006; console.log(num.toFixed(2)); 0.01 var num = 0.016; console.log(num.toFixed(2)); 0.02 var num = 0.096; console.log(num.toFixed(2)); 0.10
以6結(jié)尾這種情況下toFixed表現(xiàn)的也不錯(cuò),并沒(méi)有錯(cuò)誤的問(wèn)題。
以5為舍入位:
5后非零:
var num = 0.0051; console.log(num.toFixed(2)); 0.01 var num = 0.0052; console.log(num.toFixed(2)); 0.01 var num = 0.0059; console.log(num.toFixed(2)); 0.01
根據(jù)規(guī)則,五后非零就進(jìn)一,我們證實(shí)并沒(méi)有任何的問(wèn)題。
以5為舍入位:
5后為零: 由于這種情況比較特殊,是toFixed方法出現(xiàn)計(jì)算錯(cuò)誤的情況,所以我進(jìn)行了大量的證實(shí),且分別在常見(jiàn)的主流瀏覽器下進(jìn)行了測(cè)試:
以如下測(cè)試用例為例:
var num = 0.005; console.log(num.toFixed(2)); var num = 0.015; console.log(num.toFixed(2)); var num = 0.025; console.log(num.toFixed(2)); var num = 0.035; console.log(num.toFixed(2)); var num = 0.045; console.log(num.toFixed(2)); var num = 0.055; console.log(num.toFixed(2)); var num = 0.065; console.log(num.toFixed(2)); var num = 0.075; console.log(num.toFixed(2)); var num = 0.085; console.log(num.toFixed(2)); var num = 0.095; console.log(num.toFixed(2));
chrome、firefox、safari、opera的結(jié)果如下:
0.01
0.01
0.03
0.04
0.04
0.06
0.07
0.07
0.09
0.10
ie11結(jié)果如下:
0.01
0.02
0.03
0.04
0.05
0.06
0.07
0.08
0.09
0.10
可以看出Ie11下正常,其余瀏覽器下均出現(xiàn)錯(cuò)誤。雖然并不完全符合銀行家舍入法的規(guī)則,我認(rèn)為是由于二進(jìn)制下浮點(diǎn)數(shù)的坑導(dǎo)致了不完全符合該規(guī)則。
總而言之:不論引入toFixed解決浮點(diǎn)數(shù)計(jì)算精度缺失的問(wèn)題也好,它有沒(méi)有使用銀行家舍入法也罷,都是為了解決精度的問(wèn)題,但是又離不開(kāi)二進(jìn)制浮點(diǎn)數(shù)的環(huán)境,但至少他幫助我們找到了問(wèn)題所在,從而讓我們有解決方法。
解決方法
下面我提供一種通過(guò)重寫(xiě)toFixed的方法:
Number.prototype.toFixed = function(length) { var carry = 0; //存放進(jìn)位標(biāo)志 var num,multiple; //num為原浮點(diǎn)數(shù)放大multiple倍后的數(shù),multiple為10的length次方 var str = this + ''; //將調(diào)用該方法的數(shù)字轉(zhuǎn)為字符串 var dot = str.indexOf("."); //找到小數(shù)點(diǎn)的位置 if(str.substr(dot+length+1,1)>=5) carry=1; //找到要進(jìn)行舍入的數(shù)的位置,手動(dòng)判斷是否大于等于5,滿足條件進(jìn)位標(biāo)志置為1 multiple = Math.pow(10,length); //設(shè)置浮點(diǎn)數(shù)要擴(kuò)大的倍數(shù) num = Math.floor(this * multiple) + carry; //去掉舍入位后的所有數(shù),然后加上我們的手動(dòng)進(jìn)位數(shù) var result = num/multiple + ''; //將進(jìn)位后的整數(shù)再縮小為原浮點(diǎn)數(shù) /* * 處理進(jìn)位后無(wú)小數(shù) */ dot = result.indexOf("."); if(dot < 0){ result += '.'; dot = result.indexOf("."); } /* * 處理多次進(jìn)位 */ var len = result.length - (dot+1); if(len < length){ for(var i = 0; i < length - len; i++){ result += 0; } } return result; }
該方法的大致思路是首先找到舍入位,判斷該位置是否大于等于5,條件成立手動(dòng)進(jìn)一位,然后通過(guò)參數(shù)大小將原浮點(diǎn)數(shù)放大10的參數(shù)指數(shù)倍,然后再將包括舍入位后的位數(shù)利用floor全部去掉,根據(jù)我們之前的手動(dòng)進(jìn)位來(lái)確定是否進(jìn)位。
以上就是本文的全部?jī)?nèi)容,希望對(duì)大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。
- JS處理數(shù)據(jù)四舍五入(tofixed與round的區(qū)別詳解)
- JS使用tofixed與round處理數(shù)據(jù)四舍五入的區(qū)別
- Javascript中 toFixed四舍六入方法
- JavaScript中Number對(duì)象的toFixed() 方法詳解
- js toFixed()方法的重寫(xiě)實(shí)現(xiàn)精度的統(tǒng)一
- js保留兩位小數(shù)使用toFixed實(shí)現(xiàn)
- javascript中的toFixed固定小數(shù)位數(shù) 簡(jiǎn)單實(shí)例分享
- JS中toFixed()方法引起的問(wèn)題如何解決
- JavaScript toFixed() 方法
- javascript之對(duì)系統(tǒng)的toFixed()方法的修正
- javascript中toFixed()四舍五入使用方法詳解
相關(guān)文章
JS中循環(huán)遍歷數(shù)組的四種方式總結(jié)
這篇文章主要給大家總結(jié)介紹了關(guān)于JS中循環(huán)遍歷數(shù)組的四種方式,文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2021-01-01javascript代碼編寫(xiě)需要注意的7個(gè)小細(xì)節(jié)小結(jié)
每種語(yǔ)言都有它特別的地方,對(duì)于JavaScript來(lái)說(shuō),使用var就可以聲明任意類型的變量,這門(mén)腳本語(yǔ)言看起來(lái)很簡(jiǎn)單,然而想要寫(xiě)出優(yōu)雅的代碼卻是需要不斷積累經(jīng)驗(yàn)的。本文利列舉了JavaScript初學(xué)者應(yīng)該注意的七個(gè)細(xì)節(jié),與大家分享。2011-09-09JS實(shí)現(xiàn)頭條新聞的經(jīng)典輪播圖效果示例
這篇文章主要介紹了JS實(shí)現(xiàn)頭條新聞的經(jīng)典輪播圖效果,涉及javascript圖片輪播切換相關(guān)實(shí)現(xiàn)技巧,需要的朋友可以參考下2019-01-01js實(shí)現(xiàn)點(diǎn)擊選項(xiàng)置頂動(dòng)畫(huà)效果
這篇文章主要為大家詳細(xì)介紹了js實(shí)現(xiàn)點(diǎn)擊選項(xiàng)置頂動(dòng)畫(huà)效果,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2020-08-08原生js實(shí)現(xiàn)移動(dòng)小球(碰撞檢測(cè))
這篇文章主要介紹了原生js實(shí)現(xiàn)會(huì)動(dòng)的小球,碰撞檢測(cè)功能,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2020-12-12security.js實(shí)現(xiàn)的RSA加密功能示例
這篇文章主要介紹了security.js實(shí)現(xiàn)的RSA加密功能,結(jié)合實(shí)例形式分析了基于security.js進(jìn)行RSA加密的相關(guān)操作技巧,需要的朋友可以參考下2018-06-06Javascript 獲取字符串字節(jié)數(shù)的多種方法
Javascript 字符串字節(jié)數(shù)獲取功能多種方法2009-06-06