JavaScript中的各種小坑匯總

1、Number()將部分非數字類型轉換為0

強制轉換為數值類型函數：

parseFloat、parseInt

優點：對非數值類型統一返回NaN

缺點：會將一部分符合數值類型的字符串也識別為數值

parseFloat("1")//1

parseFloat("1s")//1，不是想要的
parseFloat(null)//NaN
parseFloat(undefined)//NaN
parseFloat("")//NaN

Number

優點：對於字符串必須全部符合數值類型才會轉換成功

缺點：會將部分非數值類型轉換為0

Number("1")//1
Number("1s")//NaN
Number(null)//0，不是想要的
Number(undebug)//NaN
Number("")//0，不是想要的

其中Number(null)和Number(“”)都會返回0，而不是NaN，從而導致了各種bug。

判斷是否是數值類型的解決方案

使用jquery提供的$.isNumeric函數判斷。

$.isNumeric("1")//true
$.isNumeric("1s")//false
$.isNumeric(null)//false
$.isNumeric(undefined)//false
$.isNumeric("")//false

全部正確，附jquery的$.isNumeric函數源碼：

isNumeric: function( obj ) {
    // parseFloat NaNs numeric-cast false positives (null|true|false|"")
    // ...but misinterprets leading-number strings, particularly hex literals ("0x...")
    // subtraction forces infinities to NaN
    // adding 1 corrects loss of precision from parseFloat (#15100)
    return !jQuery.isArray( obj ) && (obj - parseFloat( obj ) + 1) >= 0;
},

 

2、"".split(",")函數會返回長度為1的數組

在說這個問題提之前需要先說下split函數的幾種特殊值的情況。

字符串的split函數的特殊值情況

1、參數不傳，返回包含原字符串對象，長度為1的數組。

"".split()//[""]
"xxcanghai".split()//["xxcanghai"]

 

2、參數傳空字符串，返回將原字符串每個字符分隔的數組

若原字符串為空字符串則返回空數組

"".split("")//[]
"xxcanghai".split("")//["x", "x", "c", "a", "n", "g", "h", "a", "i"]

 

3、原字符串為空字符串，參數不為空時，會返回包含一個空字符串的數組

"".split(",")//[""]，錯誤，應為[]
"".split("xxcanghai")//[""]，錯誤，應為[]

可見，原字符串長度為0，且分隔符長度大於0時，會返回一個包含空字符串的數組。

因為這個問題，導致了各種各樣的bug。

 

待續…