[轉載]在 JavaScript 中判斷「空值」

http://lync.in/check-empty-value-in-javascript/

有時候咱們會遇到這樣的狀況：在一些前端控件要提交數據到服務器端的數據驗證過程當中，須要判斷提交的數據是否爲空。若是是普通表單的字符串數據，只須要在 trim 後判斷 length 便可，而這裏須要的數據能夠是各類不一樣的類型(數字、字符串、數組、對象等等)，經過 JSON.stringify(data) 進行序列化後再傳遞。

在這裏定義以下的數據值爲「空值」：

• undefined
• null
• 空字符串及純空白字符串：''、'    ' 等。
• 空數組：[]
• 空對象：{}

對於除此之外的數據值，均認爲不爲空。

其中 null 和 undefined 很容易識別，但對於其餘類型，咱們需要獲得其數據類型才能用相應的方法去檢測數據是否爲空。最容易想到的方法就是利用 typeof 操做符：

JavaScript

1 2 3

if(typeof data === 'number') { //deal with numbers }

但 typeof 返回的類型字符串只有 'object'、'function'、'number'、'boolean'、'string'、'undefined' 這六種，不少原生對象如 Date、RegExp 對象沒法與用 {} 建立的對象進行區分。另外，typeof 對於一些基本數據類型如 (String、Number、Boolean) 與其對應的基本包裝類型數據會分別返回不一樣值，如：

JavaScript

1 2 3 4 5 6

console.log(typeof false); //'boolean' console.log(typeof new Boolean(false)); //'object' console.log(typeof 1); //'number' console.log(typeof new Number(1)); //'object' console.log(typeof ''); //'string' console.log(typeof new String('')); //'object'

這對咱們的判斷也有必定的影響。

用 instanceof？這隻能判斷對象，並且存在多 frame 時多個同類對象不共享 prototype 的問題，從其餘 frame 中取得的對象沒法正確判斷。

還好，還有一個最簡單也最可靠的方法：Object.prototype.toString。對於不一樣類型的數據，這個方法能夠返回 '[object Object]'、'[object Array]'、'[object String]' 這樣的字符串，很是方便判斷。須要注意的是，在 IE8 及其如下瀏覽器中，這個方法對於 null、undefined、window 等都會返回 '[object Object]'，不過還好，這並不影響咱們使用它判斷空對象。

下面直接上代碼，說明就看註釋吧。

JavaScript

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18

// with jQuery var isEmptyValue = function(value) { var type; if(value == null) { // 等同於 value === undefined || value === null return true; } type = Object.prototype.toString.call(value).slice(8, -1); switch(type) { case 'String': return !$.trim(value); case 'Array': return !value.length; case 'Object': return $.isEmptyObject(value); // 普通對象使用 for...in 判斷，有 key 即爲 false default: return false; // 其餘對象均視做非空 } };

對於不一樣 value 值，我作了個測試，看看對於不一樣值分別取 Object.prototype.toString、typeof、isEmpty 的結果。測試結果能夠到下面這個地址圍觀：
http://jsfiddle.net/Justineo/hFKRt/

除了 IE8 及其如下瀏覽器外，其餘瀏覽器結果基本一致，下面就貼下主要的 2 種結果吧。下圖爲 Firefox 下的結果，而在 Chrome 下，window 字符串化後的結果是 'object global'，和 Firefox 下稍有不一樣，但在判斷空值時問題不大。

Firefox 下的結果

IE8 及如下惟一會誤判的是 alert，不過這對於數據驗證來講應該也能夠接受。

IE8 及如下的結果