珍愛生命,遠離JS=>JS避坑記

funnyZpC發表於2018-02-03

JavaScript避坑記

轉載請註明源地址: http://www.cnblogs.com/funnyzpc/p/8407952.html

上圖=>

  有意思的漫畫,不知大家看懂了沒,這裡我想說的是以上這些坑我都碰過,當然包含且不僅限於此, 遂這次借漫畫將之前寫前端時掉過的坑一一羅列哈(雖然不夠完整。。。)。

第一回合:js運算精度問題=>

1 輸入>0.1+0.2==0.3
2 返回>false
3 
4 輸入>0.1+0.2
5 返回>0.30000000000000004

  很怪,經常會在前端計算的時候碰到這個問題,所以如果是多個變數相運算切勿兩兩預算後再將其值和其餘變數運算,這樣很容易掉坑,如果實在不行的話,我支一招,請看->

1 輸入>var num=0.1+0.2;
2 輸入>var num2=num.toFixed(2);
3 輸入>num2
4 返回>"0.30"
5 輸入>Number(num2);
6 返回>0.3

  思路很簡單,先賦給個變數,用toFixed(保留小數位);函式四捨五入,但是這樣還不夠,如果處理的值還需要參與運算的話,需要用Number(值/變數);函式轉換為數字型別,因為js屬於指令碼語言,這個問題也時常會被忽略,各位一定要小心謹慎才是呀~

 

第二回合:js變數運算問題,請看=>

1 輸入>"2"-3
2 返回>-1
3 
4 輸入>"2"+3
5 返回>"23"
6 
7 輸入>"2"+-3
8 返回>"2-3"

  額,我想說的是。。。你得繞道走。。。,為什麼,因為兩種型別之間的運算,運算方式走的內部邏輯不一樣,有時候java也會碰到這個問題,但是java有巨多處理函式來避坑,對於js處理以上類別問題,能通過其他方式避免更好,如不能還是給個解決思路吧,額,具體點兒就是:將所有的運算引數先轉成Number型別再運算,如果是變數型別,切需要注意你的變數是否包含數字,如果不包含就更麻煩了,需要用isNaN(變數);函式來處理後再行Number函式處理後運算之->

1 輸入>Number("2")-Number("3")
2 返回>-1
3 
4 輸入>Number("2")+Number("3")
5 返回>5
6 
7 輸入>Number("2")+-Number("3")
8 返回>-1

 

第三回合:數字字串比較大小問題=>

1 輸入>"1">"2"
2 返回>false
3 
4 輸入>"11">"9"
5 返回>false

  這個問題,怎麼說呢,如果需要比較的是數字,請將比較兩邊的字串數字轉換成數字後再行比較的好(Number(變數);函式),如果比較的是字串的話,需要說的是如果比較兩邊都是字元的話,實際比較是按相同位置上的數字大小來比較的,所以看起來會有寫怪怪的,如果比較的兩邊都是一位數的數字的話都是沒有問題的,但是僅限於此;額~,需要再囉嗦的是如果兩邊的值的型別不一致的話一定要轉換成一致型別的變數比較才會準確(數字和數字字串比較也是坑。。。),這裡就不給解藥,大家看看以上兩回合就知道具體解決辦法啦。

 

第四回合:js中true、false與undefined的問題=>

1 輸入>undefined==true
2 返回>false
3 
4 輸入>undefined==false
5 返回>false
6 
7 輸入>if(!undefined) console.log(false);
8 返回>false

  看起來更加怪異,對不,額。。。,我想說的是:這個無解。。。(讓我先哭會兒...)。。。;對於此只能死記硬背了,簡單總結就是:undefined這個東東不等於false也不等於true,但是,但是,敲黑板=>在判斷語句中它是false

現在是:2018-02-03 23:31:31,夜深了,狼來了,躲被窩

 

相關文章