js避坑歷險記

一個碼農的武林發表於2019-07-04

程式碼改變世界,世界改變碼農,碼農改變程式碼!

我就是我,我就是一個碼農的武林。

前方JS巨坑出沒,請注意集中力!

巨坑1:js精度問題

前段時間去一家物流公司面試,做了一個js題,印象尤為深刻:

var one=0.1;
var two=0.2;
var six=0.6;
var eight=0.8;
console.log([two-one==one,eight-six==two]);

 當時的我是反應速度極快的,這是考數學嗎,當然全true啊?回頭再電腦上一試,發現是[true,false]。坑爹啊!玩我呢!

碼農大人我馬上速查百度,才發現js確實是有精度一說,瀏覽器處理不了太大的資料,範圍是2的平方到52次方之間;例如16個9是和10000000000000001相等,懵逼了吧!

同時,瀏覽器也存在處理小數不準確的事實。這是因為計算機只識別二進位制資料,而且只能顯示一定的有限長度。

小數精度常見場景:購物車裡物品的價格計算與顯示,在不同瀏覽器或裝置上顯示價格不一樣,可能就是精度的問題。

解決方案:toFixed後再Number一下就可以了。

巨坑2:js的計算問題

console.log("9"+-3);

  第一眼覺得應該是寫錯了,執行應該報錯嘛!但是,不對,現實很殘忍!瀏覽器控制檯顯示為6。對於此,我只能呵呵,對於這兩種運算,js的內部處理邏輯是不太一樣的。而且不加括號也是可以運算的。要避免這種坑,除了書寫規範外,我們們最好先isNaN後再Number一下,再來進行運算。

巨坑3:js的字元比較問題

console.log("37">"8");

 腦洞還是限制了我的想象力,答案竟然是false。細查,發現js中對於字串的比較,是按位從左到右的相同位置來做比較的。避坑指南:忍忍吧,還是先Number一下再做比較哦,字串跟數字一定要分清楚哦!

巨坑4:js中undefined做比較的情況

console.log(undefined==true);//false
console.log(undefined==false);//false

if(!undefined)console.log(false);//輸出了false

   上面的是什麼梗?undefined和true或false做比較都是false!沒天理啊,為啥?碼農大人我也不知道,姑且死記硬背吧,注意undefined作為條件來判斷是false。

以上的坑,你們都碰到過麼?嘻嘻,如果你還碰到其他的坑,歡迎分享和留言。小生在此獻醜了。

 

相關文章