整合營銷服務商

          電腦端+手機端+微信端=數據同步管理

          免費咨詢熱線:

          html固定定位position值fixed

          定定位:(1)給自身設置寬高。(2)再設置position:fixed

          在公司項目中涉及到一個有大量浮點數價格計算的模塊,從而引發了我一系列的思考:

          • 計算機二進制環境下浮點數的計算精度缺失問題;
          console.log(0.1 + 0.2);
          0.30000000000000004
          
          • 為了解決上述問題,使用了toFixed方法。卻出現了浮點數小數位以5結尾的四舍五入錯誤問題;
          var num = 0.045;
          console.log(num.toFixed(2)); // 0.04
          

          以此為起點,引發了我關于toFixed的一系列探索,終于找到了一些有用的信息,toFixed使用的計算規則是:

          銀行家舍入:所謂銀行家舍入法,其實質是一種四舍六入五取偶(又稱四舍六入五留雙)法。

          簡單來說就是:四舍六入五考慮,五后非零就進一,五后為零看奇偶,五前為偶應舍去,五前為奇要進一。

          下面我們就來證實這個所謂的銀行家舍入法,證實分為三種情況,分別以4、5、6為舍入位對toFixed的證實(以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結尾這種情況下toFixed表現的還算不錯,并沒有錯誤的問題。

          • 以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結尾這種情況下toFixed表現的也不錯,并沒有錯誤的問題。

          • 以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
          

          根據規則,五后非零就進一,我們證實并沒有任何的問題。

          5后為零

          由于這種情況比較特殊,是toFixed方法出現計算錯誤的情況,所以我進行了大量的證實,且分別在常見的主流瀏覽器下進行了測試:

          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的結果如下:

          0.01

          0.01

          0.03

          0.04

          0.04

          0.06

          0.07

          0.07

          0.09

          0.10

          ie11結果如下:

          0.01

          0.02

          0.03

          0.04

          0.05

          0.06

          0.07

          0.08

          0.09

          0.10

          可以看出Ie11下正常,其余瀏覽器下均出現錯誤。雖然并不完全符合銀行家舍入法的規則,我認為是由于二進制下浮點數的坑導致了不完全符合該規則。

          總而言之:不論引入toFixed解決浮點數計算精度缺失的問題也好,它有沒有使用銀行家舍入法也罷,都是為了解決精度的問題,但是又離不開二進制浮點數的環境,但至少他幫助我們找到了問題所在,從而讓我們有解決方法。

          解決方法

          下面我提供一種通過重寫toFixed的方法:

          如果你在工作中碰到這個問題,不妨試試,如果好用,可以給我點贊或者打賞一下辛苦費,謝謝(還有一種解決方案放在我之前的文章里面了,如果感興趣可以翻閱)

          參考文章:

          http://www.chengfeilong.com/toFixed

          定定位(1)給自身設置寬高(2)設置position:fixed(3)底部元素內頂邊距


          主站蜘蛛池模板: 无码人妻一区二区三区在线视频| 黄桃AV无码免费一区二区三区| 国产一区在线观看免费| 中文字幕久久久久一区| 亚洲丰满熟女一区二区哦| 成人精品视频一区二区三区不卡 | 国产在线精品一区二区中文 | 日本精品一区二区三区在线视频 | 一区二区精品久久| 国产精品久久久久一区二区三区 | 日本高清无卡码一区二区久久 | 合区精品久久久中文字幕一区| 久久人妻无码一区二区| 国产精品一区在线麻豆| 中文字幕一区二区三区5566| 久久99国产精品一区二区| 亚洲夜夜欢A∨一区二区三区 | 欧美日韩综合一区二区三区| 亚洲一区精彩视频| 人妻少妇精品视频三区二区一区| 亚洲a∨无码一区二区| 无码人妻精品一区二区三区久久久 | 成人欧美一区二区三区在线视频| 亚洲欧美日韩一区二区三区| 国产对白精品刺激一区二区| 国产日韩精品视频一区二区三区| 无码喷水一区二区浪潮AV| 国产精品伦子一区二区三区| 爆乳熟妇一区二区三区| 手机看片福利一区二区三区| 无码国产精品一区二区免费16| 亚洲高清日韩精品第一区| 无码日韩精品一区二区免费| 视频一区视频二区在线观看| 亚洲日韩精品一区二区三区| 无码乱码av天堂一区二区| 国产一区二区精品在线观看| 国产亚洲日韩一区二区三区| 国产乱码精品一区二区三区中| 波多野结衣中文一区| 国产一区二区三区久久|