全國(guó)咨詢(xún)/投訴熱線:400-618-4000

首頁(yè)技術(shù)文章正文

Web前端開(kāi)發(fā)培訓(xùn)之JS中toFixed四舍五入的坑

更新時(shí)間:2017-04-14 來(lái)源:黑馬程序員Web前端培訓(xùn)學(xué)院 瀏覽量:

最近發(fā)現(xiàn)JS當(dāng)中toFixed方法存在一些問(wèn)題。toFixed這個(gè)函數(shù)一直在用,以前都是把 Number 四舍五入為指定小數(shù)位數(shù)的數(shù)字,沒(méi)有考慮其他。今天需要考慮擴(kuò)展一下功能,于是搜索了一下,竟然發(fā)現(xiàn)了一個(gè)大坑。
請(qǐng)看下面的例子:
  1. var num = 3.15;
  2. var n = num.toFixed(1);
  3. console.log(n);
復(fù)制代碼
打印結(jié)果是3.1!
說(shuō)好的四舍五入呢?不急,再看下面的例子:
  1. var num = 3.25;
  2. var n = num.toFixed(1);
  3. console.log(n);
復(fù)制代碼
納尼?3.3!這下又四舍五入了。why?網(wǎng)上有人據(jù)此整理出“四舍六入,五看奇偶”的原則,就是說(shuō)大于五的就進(jìn)一位,五呢偶進(jìn)奇不進(jìn)。那么是不是這樣呢?請(qǐng)看下面的例子:
  1. var num1 = 3.55;
  2. var num2 = 3.65;
  3. var num3 = 3.05;
  4. var n1 = num1.toFixed(1);
  5. var n2 = num2.toFixed(1);
  6. var n3 = num3.toFixed(1);
  7. console.log(n1,n2,n3);
復(fù)制代碼
效果預(yù)覽:



file:///C:/Users/ADMINI~1/AppData/Local/Temp/ksohtml/wps50B3.tmp.jpg
按照“四舍六入,五看奇偶”的原則,n1==3.5是對(duì)的,n2==3.7才是, n3==3.1(這里不討論0算不算偶數(shù),根據(jù)我小學(xué)知識(shí)算它偶數(shù))才對(duì)嘛。然并卵,機(jī)器是不會(huì)騙人的。

根據(jù)測(cè)試,2、3、4、7、8、9這幾個(gè)都會(huì)四舍五入。
還有誰(shuí)不懵逼的!?
根據(jù)多方查證,完美的處理方式是自己改寫(xiě)這個(gè)函數(shù)。

至于JavaScript內(nèi)部是為什么,沒(méi)去摳。有興趣的同學(xué)可以去研究下,希望不吝賜教。

當(dāng)然,對(duì)于大多數(shù)情況,這個(gè)問(wèn)題也不是什么問(wèn)題。

另外,附帶提一下push()。
網(wǎng)上有的同學(xué)把join錯(cuò)寫(xiě)成push時(shí)出了問(wèn)題,形如下面:
  1. //目標(biāo),希望得到1
  2. var arr = ["1"];
  3. console.log(arr.join(","));
  4. //錯(cuò)寫(xiě),結(jié)果得到2
  5. var arr = ["1"];
  6. console.log(arr.push(","));
復(fù)制代碼
效果預(yù)覽:

file:///C:/Users/ADMINI~1/AppData/Local/Temp/ksohtml/wps50C4.tmp.jpg
why?其實(shí)我們仔細(xì)點(diǎn)就可以發(fā)現(xiàn),join那里打印出來(lái)的是字符串"1",push那里打印出來(lái)的是數(shù)字2。

    join()把數(shù)組中的所有元素轉(zhuǎn)換為一個(gè)字符串,返回結(jié)果---轉(zhuǎn)換后的字符串
    push()是往數(shù)組中添加新元素,返回結(jié)果---新數(shù)組的長(zhǎng)度。

綜上所述,結(jié)果并沒(méi)有問(wèn)題,只是這位同學(xué)不清楚兩個(gè)函數(shù)的返回結(jié)果。



本文版權(quán)歸黑馬程序員web前端開(kāi)發(fā)學(xué)院所有,歡迎轉(zhuǎn)載,轉(zhuǎn)載請(qǐng)注明作者出處,謝謝!
作者:黑馬程序員Web前端培訓(xùn)學(xué)院;
首發(fā):http://m.pantone-color.com.cn/news/web.html 
分享到:
在線咨詢(xún) 我要報(bào)名
和我們?cè)诰€交談!