【轉載】JS - 浮點數(shù)運算的精度問題

原文鏈接

浮點數(shù)溢出

平時我們在進行數(shù)據(jù)運算的時候再悼,會遇到浮點數(shù)溢出的情況

// 加法
0.1 + 0.2 = 0.30000000000000004
0.2 + 0.4 = 0.6000000000000001
 
// 減法
1.5 - 1.2 = 0.30000000000000004
0.3 - 0.2 = 0.09999999999999998
 
// 乘法
19.9 * 100 = 1989.9999999999998
9.7 * 100 = 969.9999999999999
 
// 除法 
0.3 / 0.1 = 2.9999999999999996
0.69 / 10 = 0.06899999999999999

 // 比較
 0.1 + 0.2 === 0.3 // false
 (0.3 - 0.2) === (0.2 - 0.1) // false

導致原因

JavaScript 內部只有一種數(shù)字類型Number论悴,也就是說,JavaScript 語言的底層根本沒有整數(shù),所有數(shù)字都是以IEEE-754標準格式64位浮點數(shù)形式儲存只盹,1與1.0是相同的觉啊。因為有些小數(shù)以二進制表示位數(shù)是無窮的市栗。JavaScript會把超出53位之后的二進制舍棄旺聚,所以涉及小數(shù)的比較和運算要特別小心织阳。

浮點數(shù)

JS的浮點數(shù)實現(xiàn)遵循IEEE 754標準,采用雙精度存儲(double precision)砰粹,使用64位固定長度來表示唧躲,其中1位用來表示符號位,11位用來表示指數(shù)伸眶,52位表示尾數(shù)惊窖。

  • 符號位(sign):第1位是正負數(shù)符號位,0代表正數(shù),1代表負數(shù)
  • 指數(shù)位(Exponent):中間11位存儲指數(shù)污呼,用來表示次方數(shù)
  • 尾數(shù)位(mantissa):最后的52位是尾數(shù)座舍,超出部分自動進一舍零
計算過程

十進制的0.1和0.2都會被轉換成二進制,但由于浮點數(shù)用二進制表達時是無窮的

0.1——>0.0001 1001 1001 1001 ...(1001循環(huán))
0.2——>0.0011 0011 0011 0011 ...(0011循環(huán))

IEEE 754 標準的 64 位雙精度浮點數(shù)的小數(shù)部分最多支持 53 位二進制位馅笙,所以兩者相加之后得到二進制為:

0.0100110011001100110011001100110011001100110011001100 

因浮點數(shù)小數(shù)位的限制而截斷的二進制數(shù)字,再轉換為十進制,就成了 0.30000000000000004岳掐。所以在進行算術計算時會產生誤差。

整數(shù)的精度問題
console.log(19571992547450991); //=> 19571992547450990
console.log(19571992547450991===19571992547450992); //=> true

同樣的原因饭耳,在 JavaScript 中 Number類型統(tǒng)一按浮點數(shù)處理串述,整數(shù)是按最大54位來算最大(253 - 1,Number.MAX_SAFE_INTEGER,9007199254740991) 和最小(-(253 - 1)寞肖,Number.MIN_SAFE_INTEGER,-9007199254740991) 安全整數(shù)范圍的纲酗。所以只要超過這個范圍,就會存在被舍去的精度問題新蟆。

解決方法

第三方庫

  1. Math.js
    為 JavaScript 和 Node.js 提供的一個廣泛的數(shù)學庫觅赊。
  2. decimal.js
    為 JavaScript 提供十進制類型的任意精度數(shù)值。
  3. big.js

toFixed 方法

numObj.toFixed(digits)

參數(shù) digits 表示小數(shù)點后數(shù)字的個數(shù)琼稻;介于 0 到 20 (包括)之間吮螺,實現(xiàn)環(huán)境可能支持更大范圍。如果忽略該參數(shù)帕翻,則默認為 0鸠补。
返回一個數(shù)值的字符串

parseFloat((1.0 - 0.9).toFixed(10)) // 0.1  

注意:在老版本的IE瀏覽器(IE 6,7嘀掸,8)中紫岩,toFixed()方法返回值不一定準確。

toPrecision 方法

parseFloat((1.0 - 0.9).toPrecision(10)) // 0.1  

自定義函數(shù)

常用的是這種方法横殴,可以有效的處理浮點數(shù)運算

Math.formatFloat = (val, digit = 100) => {
    const m =  Math.pow(10, digit);
    return (Math.round(val * m) / m);
}

toPrecision 與 toFixed

toPrecision 是處理精度被因,精度是從左至右第一個不為0的數(shù)開始數(shù)起卿拴。
toFixed是 小數(shù)點后指定位數(shù)取整,從小數(shù)點開始數(shù)起梨与。
兩者都能對多余數(shù)字做湊整處理

網(wǎng)上流傳的函數(shù)
加法函數(shù)
/**
 ** 加法函數(shù)堕花,用來得到精確的加法結果
 ** 說明:javascript的加法結果會有誤差,在兩個浮點數(shù)相加的時候會比較明顯粥鞋。這個函數(shù)返回較為精確的加法結果缘挽。
 ** 調用:accAdd(arg1,arg2)
 ** 返回值:arg1加上arg2的精確結果
 **/
function accAdd(arg1, arg2) {
    var r1, r2, m, c;
    try {
        r1 = arg1.toString().split(".")[1].length;
    }
    catch (e) {
        r1 = 0;
    }
    try {
        r2 = arg2.toString().split(".")[1].length;
    }
    catch (e) {
        r2 = 0;
    }
    c = Math.abs(r1 - r2);
    m = Math.pow(10, Math.max(r1, r2));
    if (c > 0) {
        var cm = Math.pow(10, c);
        if (r1 > r2) {
            arg1 = Number(arg1.toString().replace(".", ""));
            arg2 = Number(arg2.toString().replace(".", "")) * cm;
        } else {
            arg1 = Number(arg1.toString().replace(".", "")) * cm;
            arg2 = Number(arg2.toString().replace(".", ""));
        }
    } else {
        arg1 = Number(arg1.toString().replace(".", ""));
        arg2 = Number(arg2.toString().replace(".", ""));
    }
    return (arg1 + arg2) / m;
}
 
//給Number類型增加一個add方法,調用起來更加方便呻粹。
Number.prototype.add = function (arg) {
    return accAdd(arg, this);
};

減法函數(shù)
/**
 ** 減法函數(shù)壕曼,用來得到精確的減法結果
 ** 說明:javascript的減法結果會有誤差,在兩個浮點數(shù)相減的時候會比較明顯等浊。這個函數(shù)返回較為精確的減法結果腮郊。
 ** 調用:accSub(arg1,arg2)
 ** 返回值:arg1加上arg2的精確結果
 **/
function accSub(arg1, arg2) {
    var r1, r2, m, n;
    try {
        r1 = arg1.toString().split(".")[1].length;
    }
    catch (e) {
        r1 = 0;
    }
    try {
        r2 = arg2.toString().split(".")[1].length;
    }
    catch (e) {
        r2 = 0;
    }
    m = Math.pow(10, Math.max(r1, r2)); //last modify by deeka //動態(tài)控制精度長度
    n = (r1 >= r2) ? r1 : r2;
    return ((arg1 * m - arg2 * m) / m).toFixed(n);
}
 
// 給Number類型增加一個mul方法,調用起來更加方便筹燕。
Number.prototype.sub = function (arg) {
    return accMul(arg, this);
};

乘法函數(shù)
/**
 ** 乘法函數(shù)轧飞,用來得到精確的乘法結果
 ** 說明:javascript的乘法結果會有誤差,在兩個浮點數(shù)相乘的時候會比較明顯撒踪。這個函數(shù)返回較為精確的乘法結果过咬。
 ** 調用:accMul(arg1,arg2)
 ** 返回值:arg1乘以 arg2的精確結果
 **/
function accMul(arg1, arg2) {
    var m = 0, s1 = arg1.toString(), s2 = arg2.toString();
    try {
        m += s1.split(".")[1].length;
    }
    catch (e) {
    }
    try {
        m += s2.split(".")[1].length;
    }
    catch (e) {
    }
    return Number(s1.replace(".", "")) * Number(s2.replace(".", "")) / Math.pow(10, m);
}
 
// 給Number類型增加一個mul方法,調用起來更加方便制妄。
Number.prototype.mul = function (arg) {
    return accMul(arg, this);
};

除法函數(shù)
/** 
 ** 除法函數(shù)掸绞,用來得到精確的除法結果
 ** 說明:javascript的除法結果會有誤差,在兩個浮點數(shù)相除的時候會比較明顯耕捞。這個函數(shù)返回較為精確的除法結果衔掸。
 ** 調用:accDiv(arg1,arg2)
 ** 返回值:arg1除以arg2的精確結果
 **/
function accDiv(arg1, arg2) {
    var t1 = 0, t2 = 0, r1, r2;
    try {
        t1 = arg1.toString().split(".")[1].length;
    }
    catch (e) {
    }
    try {
        t2 = arg2.toString().split(".")[1].length;
    }
    catch (e) {
    }
    with (Math) {
        r1 = Number(arg1.toString().replace(".", ""));
        r2 = Number(arg2.toString().replace(".", ""));
        return (r1 / r2) * pow(10, t2 - t1);
    }
}
 
//給Number類型增加一個div方法,調用起來更加方便砸脊。
Number.prototype.div = function (arg) {
    return accDiv(this, arg);
};


參考鏈接:
JavaScript 浮點數(shù)陷阱及解法

?著作權歸作者所有,轉載或內容合作請聯(lián)系作者
  • 序言:七十年代末具篇,一起剝皮案震驚了整個濱河市,隨后出現(xiàn)的幾起案子凌埂,更是在濱河造成了極大的恐慌驱显,老刑警劉巖,帶你破解...
    沈念sama閱讀 206,378評論 6 481
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件瞳抓,死亡現(xiàn)場離奇詭異埃疫,居然都是意外死亡,警方通過查閱死者的電腦和手機孩哑,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 88,356評論 2 382
  • 文/潘曉璐 我一進店門栓霜,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人横蜒,你說我怎么就攤上這事胳蛮∠眨” “怎么了?”我有些...
    開封第一講書人閱讀 152,702評論 0 342
  • 文/不壞的土叔 我叫張陵仅炊,是天一觀的道長斗幼。 經常有香客問我,道長抚垄,這世上最難降的妖魔是什么蜕窿? 我笑而不...
    開封第一講書人閱讀 55,259評論 1 279
  • 正文 為了忘掉前任,我火速辦了婚禮呆馁,結果婚禮上桐经,老公的妹妹穿的比我還像新娘。我一直安慰自己浙滤,他們只是感情好阴挣,可當我...
    茶點故事閱讀 64,263評論 5 371
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著瓷叫,像睡著了一般屯吊。 火紅的嫁衣襯著肌膚如雪送巡。 梳的紋絲不亂的頭發(fā)上摹菠,一...
    開封第一講書人閱讀 49,036評論 1 285
  • 那天,我揣著相機與錄音骗爆,去河邊找鬼次氨。 笑死,一個胖子當著我的面吹牛摘投,可吹牛的內容都是我干的煮寡。 我是一名探鬼主播,決...
    沈念sama閱讀 38,349評論 3 400
  • 文/蒼蘭香墨 我猛地睜開眼犀呼,長吁一口氣:“原來是場噩夢啊……” “哼幸撕!你這毒婦竟也來了?” 一聲冷哼從身側響起外臂,我...
    開封第一講書人閱讀 36,979評論 0 259
  • 序言:老撾萬榮一對情侶失蹤坐儿,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后宋光,有當?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體貌矿,經...
    沈念sama閱讀 43,469評論 1 300
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內容為張勛視角 年9月15日...
    茶點故事閱讀 35,938評論 2 323
  • 正文 我和宋清朗相戀三年罪佳,在試婚紗的時候發(fā)現(xiàn)自己被綠了逛漫。 大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 38,059評論 1 333
  • 序言:一個原本活蹦亂跳的男人離奇死亡赘艳,死狀恐怖酌毡,靈堂內的尸體忽然破棺而出克握,到底是詐尸還是另有隱情,我是刑警寧澤枷踏,帶...
    沈念sama閱讀 33,703評論 4 323
  • 正文 年R本政府宣布玛荞,位于F島的核電站,受9級特大地震影響呕寝,放射性物質發(fā)生泄漏勋眯。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點故事閱讀 39,257評論 3 307
  • 文/蒙蒙 一下梢、第九天 我趴在偏房一處隱蔽的房頂上張望客蹋。 院中可真熱鬧,春花似錦孽江、人聲如沸讶坯。這莊子的主人今日做“春日...
    開封第一講書人閱讀 30,262評論 0 19
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽辆琅。三九已至,卻和暖如春这刷,著一層夾襖步出監(jiān)牢的瞬間婉烟,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 31,485評論 1 262
  • 我被黑心中介騙來泰國打工暇屋, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留似袁,地道東北人。 一個月前我還...
    沈念sama閱讀 45,501評論 2 354
  • 正文 我出身青樓咐刨,卻偏偏與公主長得像昙衅,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子定鸟,可洞房花燭夜當晚...
    茶點故事閱讀 42,792評論 2 345

推薦閱讀更多精彩內容